问题标签 [v-data-table]

我有一个从下面的 json 数据存储区填充的 Vuetify 数据表。但我不断收到这个警告：

显示和代码按预期工作，但我不喜欢错误警告并想理解它。

x.id 和 typeID 由 json 以字符串形式返回，并使用严格比较

例如

]

在我的数据表中，我列出了字符并有一个插槽来显示行中的用户类型文本。因此对于字符“Gaia”，该行将显示行 id、name.email，而不是 typeId，它将显示来自 UserType json 数据的用户类型的值——在本例中为“字符”。

为此，我使用此模板槽：

这是标题数组

我的标题：

我的模板项目：

我将能够搜索 item.name 但不能搜索 item.sku，如果标题中未指明 item.sku，我将如何使用我的搜索输入？

Vuetifyv-data-table支持多种类型的插槽v-slot:body：v-slot:item和v-slot:item.<name>.

我们一直在v-slot:item.<name>广泛使用，因为它们提供了一种灵活的方式来设置和处理各个列中的内容，并允许以编程方式更改表头。

我想为我的v-data-table行添加可拖动性，并使用Vue.Draggable 让它工作。

但是该draggable组件需要使用v-data-table v-slot:bodyie来控制整个表格，从而失去了灵活性v-slot:item.<name>。

有没有办法可以将这两个组件一起使用并提供v-slot:item.<name>支持？

目标

我想要一个v-data-table可编辑且看起来“不错”的。

问题

添加 av-text-field使其可编辑也会将行高增加到非常令人不快的水平
原始视图： 使用 v-text-field 输入

问题

如何降低行高以类似于没有v-text-fields.

作为奖励

因为我对整个前端开发类型的事物都很陌生，所以我将如何确定是什么导致了这个“高度问题”？

PS：我尝试添加一个 JSFiddle，但我什至无法弄清楚如何v-data-table正确显示...
基本草稿可以在这里找到

我目前正在为工作学习 VueJS，我正在尝试构建一个 CRUD 应用程序，该应用程序显示从 API 到 a 的项目<v-data-table>，我想使用<v-dialog>.

这是我的主屏幕：

我这样调用 API：

现在，我主要关心的是如何调用单个项目并在此对话框中显示所有详细信息：（它必须在不同的组件中）

我也不知道如何从不同组件的对话框中编辑/删除项目。

无论如何，提前感谢您的帮助

我有一种sumField方法可以对给定列中的值进行总计：

在我的数据表中，我调用sumField以生成数据表特定列中值的滚动总计：

这在屏幕上显示为数据表的附加行，并且值会根据应用于表的过滤器而变化。

有没有办法对计算的值求和，并将其显示为滚动总值？

有没有人设法在 Vuetify 数据表中实现单个列过滤？例如，每列顶部的动态下拉列表填充了列的唯一值，并在更改时过滤表。

我目前正在制作一个包含电影数据表的 CRUD 应用程序。我使用 themoviedb 作为我的 API 和 VueJS、vuetify、axios 和 vuex。我正在尝试实现服务器端分页和搜索，但我遇到了很多错误。这是我到目前为止所得到的：（我知道这可能是一团糟，但我正在学习）

我的应用组件

我在 /store 中的 index.js

我得到的错误：

我真的很感激任何帮助！

我正在使用 Vuetify <v-data-table>。如何在表头上添加按钮<th>？

这段代码是我迄今为止尝试过的。

请帮忙。

我有一个v-data-table并且我正在尝试打印我的标题，但是使用我的代码，它们都出现在一个列中而不是整个表中。

任何人都可以提供有关如何解决此问题的建议吗？