问题标签 [vuetify-datatable]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
76 浏览

vue.js - Vuetify 数据表项。未应用模板 - 但其他模板很好

编辑1:我在这里添加了一个codepen 。

我有一个简单的数据表:

使用这些标题:

这是该items部分的computed()内容:

EtaWarehouseSortnew Date(datestring).getTime()- 基本上是毫秒排序的结果。

该模板用于提供日期的“人类可读”版本 - 但正如您从屏幕截图中看到的那样,我所看到的只是毫秒。使用当前模板,我应该看到的只是损坏的单词,但我仍然看到毫秒。我不知道为什么这不应用模板。

在此处输入图像描述

0 投票
1 回答
34 浏览

vue.js - 如何使用 v-for 为每个表头动态插入文本搜索字段以实现多搜索功能?

为了实现多搜索功能,我们在每个带有 v-slot 的标题处添加一个搜索字段,我们直接定义标题名称。例如:

现在我的数据表有大约 50 个标题。我的想法是动态渲染。我尝试使用 v-for 但它既不呈现也不给出任何错误。下面的代码:

我在这里错过了什么?还是我走的路完全错了?

以下是完整代码:

0 投票
0 回答
27 浏览

nuxt.js - 单击 vuetify 数据表的标题排序后如何获取新的排序项目

我正在使用 vuetify 数据表。每次对列进行排序时,我都需要根据排序顺序获取新的 Items 数组。我应该怎么办?

0 投票
2 回答
149 浏览

css - 无法调整 vuetify v-data-table 中的页脚填充

我有一个带有标准分页页脚的非常标准的 veutify v-data-table。我需要偏移页脚项目,使它们不在浮动在它们上方的元素下方。

我试过了:

但两种方法都没有奏效。我们使用的是 SCSS 样式,而不是 SASS,所以关于页脚填充的 vue 文档似乎没有帮助。

我有足够的声誉,所以最好的答案将在 48 小时后获得 50 分赏金。

编辑:我正在使用 Vuetify 2.5.6 版

0 投票
1 回答
71 浏览

vue.js - vuetify:为什么每当用户点击输入字段时对表格进行排序

我有一个 vuetify 数据表,最初的解决方案是使用 v-for 为每个列动态分配搜索文本字段,然后实现多过滤器。以下是我的解决方案:

问题是每当用户点击特定列的文本字段时,排序功能也会同时运行。我在以下具有相同行为的笔上有一个微型解决方案。我尝试在模板标签后放置一个 div,但还是一样。请看一下。任何帮助,将不胜感激。 代码笔

0 投票
1 回答
41 浏览

javascript - 如何仅从 vuetify 表中获取字段以在 axios 中发布

如何仅从 vuetify 表中获取字段以在 axios 中发布,我有一个表,如以下代码所示

从脚本我有以下代码

我想要做的是,当它被点击时,我只用 axios 发送每个帖子的 id 但是当我点击它时,我在控制台中收到一个错误,说项目未定义,这是我的主要错误,你可以看到我需要首先验证学生的状态是否处于活动状态。下面我还添加了生成表的图像以供进一步参考。

表参考

编辑

我忘了放

但仍然不起作用,即使控制台有问题,也不再出现错误

0 投票
1 回答
69 浏览

vue.js - Vuetify Datatable Select All Not Working with Regular v-checkbox

我目前正在尝试自定义Vue Datatable ( v-datatable) 的全选复选框。我真正想做的就是为复选框本身添加一个标签或工具提示。为此,我想利用Header Data Table Select Slot / header.data-table-select,并将元素从 a 更改v-simple-checkbox为常规v-checkbox

当我添加使用 的模板时,v-simple-checkbox复选框工作得很好。您可以单击它并选择/取消选择所有行而不会出现问题。这是一个展示这个的 Codepen

但是,如果我使用常规v-checkbox,则选择/取消选择所有功能将完全离开。这个 Codepen 展示了这一点

在这种情况下,我必须将on值挂钩以使其正常工作,因为v-on似乎没有这样做?或者有没有更简单的方法来自定义我缺少的这个复选框?

0 投票
2 回答
89 浏览

javascript - 在 vuejs 的每个表格行中添加垃圾桶或删除图标

我是 vue.js 的新手,我正在尝试在表格内的每一行中添加垃圾图标并激活它以删除行但它不起作用,我怎样才能将一个单元格的输入作为下拉菜单或列表内表行。以下脚本是从教程https://smarttutorials.net/dynamically-add-or-remove-table-row-using-vuejs/复制而来 ,非常感谢您的帮助

0 投票
1 回答
29 浏览

vuetify.js - 将 uuid 添加到 Vuetify 数据表 crud 会导致新项目以重复的 uuid 结尾

我一直在使用https://vuetifyjs.com/en/components/data-tables/#crud-actions中的 Vuetify CRUD 示例。

我想为每条记录添加一个唯一的 ID。我已经拿了他们的原始代码笔并将其复制到这里导入 uuid 库。下面是一个 js 示例。 https://codepen.io/joomkit/pen/MWExOGK?editors=1011

当我在模式对话框中添加新项目时,会为添加的行创建一个新的 uuid。但是,如果您添加超过 2 个新项目,则 uuid 会重复。

这里的内置数据表索引有问题吗?

0 投票
1 回答
59 浏览

vue.js - 如何从 v-data-table 中删除全选选项?

我需要从 v-data-table(vuetify 组件)中隐藏全选选项。根据包含 header-prop 的文档,单选为 true 应该这样做但不起作用。