[Vuejs]-Vuetify.js v-data-table dynamic template

0👍

To iterate the headers dynamically for all items you’d need to use the body slot…

   <template v-slot:body="{ items }">
      <tr v-for="idx in items">
        <td v-for="header in headers" class="text-left font-weight-black">
          <v-icon v-if="idx[header.value]" color="green">check_circle</v-icon>
        </td>
      </tr>
   </template>

Demo: https://codeply.com/p/W0vKEyRGRO

Also see: Vuetify Datatable – Enable content editing on all columns

Leave a comment