title: i got this error TypeError: Cannot read property ‘url’ of null
body: <p>the problem is when i am rendering the content, i need to call {{ post.image.url }} but i get this issue “Cannot read property ‘url’ of null”</p>
  
  <p>this is my code:</p>
  
  <pre><code>data() {
              return {
                  posts: null,
                  avatar: null
              }
          }
  
  axios.get('/ajax/posts/' + user)
                      .then((response) =&gt; {
                          this.posts = response.data.posts;
                          this.avatar = response.data.avatar;
                          console.log(response.data.posts);
                      });
  </code></pre>
  
  <p>and my php code for retrieving information:</p>
  
  <pre><code>public function ajaxGetPosts($user)
      {
          $profile = User::findOrFail($user)-&gt;first();
  
          //dd($user-&gt;posts()-&gt;withCount('image')-&gt;get());
          $posts = $profile-&gt;posts()-&gt;with('image')-&gt;get();
          return response()-&gt;json([
              'posts' =&gt; $posts-&gt;toArray(),
              'avatar' =&gt; $profile-&gt;getAvatar()
          ]);
      }
  </code></pre>
  
  <p>and result in console.log is:</p>
  
  <pre><code>{
     "id":1,
     "user_id":1,
     "title":"Dolores voluptatem culpa dolor est.",
     "body":"Iste et ratione atque inventore. Quo ex ea repellat saepe est ad est dicta. Magni eum omnis dolor quam provident mollitia.",
     "created_at":"2020-03-22T16:04:47.000000Z",
     "updated_at":"2020-03-22T16:04:47.000000Z",
     "image":    {
            "id":1,
            "url":"https://loremflickr.com/600/800",
            "imageable_type":"App\\Post",
            "imageable_id":1,
            "created_at":"2020-03-22T16:57:14.000000Z",
            "updated_at":"2020-03-22T16:57:14.000000Z"
         }
  }
  </code></pre>