title: if else statement under nested loop in vue.js show the exact value
body: <p>I'm trying to make a loop to show blog posts.  Inside the loop, I use another loop to fetch blog likes.  If the auth user liked a blog, then I want to show an unlike button, otherwise a like button.  But the main loop keeps showing 2 buttons instead of one when multiple users like that blog.</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;div class="post" v-show="blogs.length" v-for="blog in blogs" :key="blog.id"&gt;
    &lt;span v-for="like in blog.likes" :key="like.id"&gt; 
      &lt;span v-if="blog.id === like.blog_id  &amp;&amp; like.user_id === authUserId"&gt;
        &lt;a href="#" class="link-black text-sm"&gt;
          &lt;i class="fas fa-thumbs-down mr-1"&gt;&lt;/i&gt; UnLike ({{blog.likes.length}}) 
        &lt;/a&gt;
      &lt;/span&gt;
      &lt;span v-else&gt;
        &lt;a href="#" class="link-black text-sm"&gt;
          &lt;i class="fas fa-thumbs-up mr-1"&gt;&lt;/i&gt; Like ({{blog.likes.length}} )
        &lt;/a&gt;
      &lt;/span&gt;
    &lt;/span&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>What am I doing wrong?</p>
  
  <p><a href="https://i.stack.imgur.com/c9sQI.png" rel="nofollow noreferrer">condition are not working</a></p>