How to Use Destructuring in a v-for Loop

Updated 2 weeks ago admin Javascript / Vue.js

You can use destructuring in a v-for loop and extract the exact values you want to display from arrays and objects.

Use destructuring in a v-for

To use destructuring in a v-for loop, you can do it like this:

<div v-for="{user, body, id} in comments" :key="id">
  <div>
     <span>
        {{user.name}}
     </span>
  </div>
  <div>
     <p>
       {{body}}
     </p>
  </div>
</div>