Question 38704 in Ubuntu Question posted in
The official Ubuntu documentation can be found here.

TypeError: Cannot read properties of null (reading 'profile_picture') in vue.js component Laravel 9 – Ubuntu

Environment
Laravel v9 + vite, PHP 8.1, vue3, VPS linux distro. UBUNTU

enter image description here

I am having this error in the vue.js component of my Laravel project,it says that the profile_picture has a null value in the object but I also put the check for this

       <div v-if="typeof rep.user.profile_picture != null">
      <img :src="rep.user.profile_picture" :alt="rep.user.name" class="commenter-image rounded-circle"/>
       </div>
        <div v-else>
        <img src="/assets/images/user-placeholder-1.jpg" alt="Commenter-placeholder" class="commenter-image rounded-circle"/>
       </div>

I have carefully searched for this profile_picture property in the file it’s not anywhere else except this. but still having this issue
also, it doesn’t have any relation with the sweetalert2 library but still, console is pointing to this library
Any thoughts about this error??
extra help meterial>>

enter image description here

Tags:

2

Answers


  1. 0

    The condition v-if="typeof rep.user.profile_picture != null" doesn’t work because typeof rep.user.profile_picture returns object. So I would suggest you to change this condition to

    v-if="rep.user.profile_picture !== null"

    or even

    v-if="rep.user && rep.user.profile_picture !== null"
    Login or Signup to reply.
  2. 0

    Looks like in some rep objects, user property is null. Can you please verify that all the objects in an array contains a value in user property.

    You can use optional chaining (?.) operator :

    v-if="rep?.user?.profile_picture !== null"
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search