1👍
You are going to have to use a computed property to format your data structure to be something like
[
[
{ id: 0, text: a, isLastRow: false },
{ id: 1, text: a, isLastRow: true },
],
[
{ id: 2, text: b, isLastRow: false },
{ id: 3, text: b, isLastRow: false },
{ id: 4, text: b, isLastRow: true },
],
];
e.g.,
computed: {
getFormatedItems() {
const sections = [[]];
let index = 0;
this.items.forEach(item => {
if (item.lastRow) {
index++;
section[index] = [];
}
section[index].push(item);
});
},
},
Then you can write you template like
<template v-for="(section, index) in getFormatedItems">
<tbody :key="index">
<tr v-for="item in section" :key="item.id">
<td>{{item.text}}</td>
</tr>
</tbody>
</template>
Source:stackexchange.com