'In Vuetify, how can I use unique sparklines in a data table?

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?)



Solution 1:[1]

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.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Samball