v-data-table 对单元格的自定义答案

【问题标题】：v-data-table customizations to cellsv-data-table 对单元格的自定义
【发布时间】：2019-03-04 18:31:37
【问题描述】：

我有一个名为“my-table”的组件，其中包含一个 v-data-table。我有许多其他组件使用它通过传入自己的标题/数据来显示基本表格。

我想更进一步，允许其他组件对单元格进行自定义。例如，也许一个组件希望特定列使用 v-icons 而不是文本。也许一个完全不同的组件希望一个单元格在单击时可编辑，等等。

在 vue 中解决此问题的最佳方法是什么？我真的必须将 myTable 代码复制/粘贴到其他组件中并在那里修改吗？ Vue 是否能够为该表注入具有特定规则的模板/组件，如果可以，是否有示例？似乎 v-html 无法处理所有必要的标签并最终剥离它们。有没有我没有想到的更好的方法？

【问题讨论】：

【解决方案1】：

您可以在组件上的命名插槽上设置条件（v-if）渲染，基本上是一个插槽设置来渲染您拥有的一组预定义代码，但它可以改变您传递给子组件的内容，或者在在这种情况下，您可以限制为要呈现的布尔值，作为道具传递给子组件。

希望这会有所帮助。

【讨论】：

我有点不清楚你的建议。你是说我应该为每个可能的表格自定义创建一个自定义插槽并将它们全部放在 myTable 文件中？
不完全是，您可以在组件中拥有任意数量的插槽，但是在您引用该组件的地方，您可以拥有渲染所需的插槽。例如：您可以拥有一个包含所有组件的表，但每当您引用此表时，您只能使用所需的插槽来获得所需的视图。请参阅我提供的命名插槽文档，它们为这个问题提供了一个很好的例子。