如何在 Element UI Table 的行中显示动态信息答案

【问题标题】：How to show dynamic info in the rows of Element UI's Table如何在 Element UI Table 的行中显示动态信息
【发布时间】：2020-03-17 14:02:33
【问题描述】：

所以，基本上我有一张这样的桌子。

<v-table :data="data">
  <v-table-column prop="data.attribute" label="Attribute">
  </v-table-column>
 </v-table>

但我不想在列的行中显示data.attribute，而是想执行类似...

return data.attribute === x ? 'Attribute equals X' : 'Attribute doesn't equal X'

这背后的原因是因为翻译。列的行显示的值实际上是存储翻译的变量。我尝试使用范围来尝试更好地理解表格，这样做：

<v-table-column prop="data.attribute" label="Attribute">
  <template slot-scope="scope">
    <input type="text" v-model="scope.row.attribute">
  </template>
</v-table-column>

Aaaand 除了创建输入字段之外什么都不做，但数据似乎没有绑定到它。感谢您的帮助。

【问题讨论】：

标签： javascript html vue.js element element-ui

【解决方案1】：

我只是注意到我的智障了。道具是data.attribute，所以在这一行：

<input type="text" v-model="scope.row.attribute">

我只需要补充：

<input type="text" v-model="scope.row.data.attribute">

我需要睡觉。无论如何，这样也可以做类似的事情：

<p>{{ scope.row.data.attribute }}</p>

只要它在具有插槽范围的模板内就可以了。

希望对某人有用。

【讨论】：