Vuejs b-table array template

user_17677039 0
Viewed 150

I want to create a b-table template can understand data type and if it is array then it shows array keys one under the other. For example:

data.item.value may be :

  • string
  • array
  • json
<b-table :items="mydata"> 

<template #cell(name)="data"> 

  <b-list-group-item>
  {{data.item.value}}
  </b-list-group-item>

</template>
</b-table>

if data.item.value is array should open new b-list-group-item automatically:

first b-list-group-item :  data.item.value[0].name
second b-list-group-item :  data.item.value[1].name

How can I handle this?

vuejs2 vuejs3 vue.js javascript
1 Answers

You would use v-for on the array inside your template. Then you can use v-if to special case type inside the group-item.

<b-table :items="mydata"> 
  <template #cell="data"> 
    <b-list-group-item v-for='value of data.item.value'>
      {{value.name}}
    </b-list-group-item> 
  </template>
</b-table>
user_50939610
Related