I want to create a Vuetify data table that has a column that contains a unique sparkline for each item in the data table. Is that possible?
There's this previous post and Sandbox example, but I'm struggling to modify it to have a unique sparkline per row. Any help or advice would be appreciated.
I have tried to add the sparkline 'value' array to the general data array in the linked example, like:
{
name: "Frozen Yogurt",
calories: 159,
fat: 6.0,
carbs: 24,
protein: 4.0,
iron: "1%",
value: [0,1,2,3,4,5]
},
But I don't know how to feed this value back into the sparkline which only takes one array, and doesn't seem to accept a list of data arrays (one per row?)
CodePudding user response:
Change: <template v-slot:item.chart>
to <template v-slot:item.chart="{ item }">
.
And change the sparkline :value
to :value="item.value"
.
Then in your desserts array add a value to each item like in your question. Example here.