我正在使用 v-data-table 并嘗試添加一個新列，即卡路里并將其除以脂肪。我正在嘗試設定新的列名，但一直無法弄清楚。
我知道使用
<template v-slot:item.fat="{item}">
<span>test1</span>
</template>
將更改放在胖列中的內容，但是如何創建新列？
這是我的代碼的鏈接https://codepen.io/aaronk488/pen/vYePVoZ?editors=101
uj5u.com熱心網友回復：
檢查我制作的這個codepen：https ://codepen.io/cmfc31/pen/dyVrQNz?editors=101
您必須在headers陣列中定義新列。
headers: [
{
text: "Dessert (100g serving)",
align: "start",
value: "name"
},
{
text: "My new column",
align: "start",
value: "mynewcol"
},
...
然后您可以使用/修改它與資料表中的item插槽，就像這樣。
<v-data-table
:headers="headers"
:items="desserts"
item-key="name"
class="elevation-1"
>
<template v-slot:item.mynewcol="{ item, index }">
{{ 'Test ' index }}
</template>
</v-data-table>
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/414175.html
標籤：
下一篇：VueJs鏈接物件中的元素