问题标签 [vue-data-tables]

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 回答
721 浏览

vuejs2 - Vue:将子组件添加到组件中

我所有的页面都是在下创建的Page-Component.vue,我正在尝试使用vue-data-tables

main.js

我的页面.vue

错误

0 投票
1 回答
2061 浏览

javascript - 在 VueJS 数据表中使用 Object 属性作为字段值

在我的项目中,我使用 VueJS (2.5.9) 来呈现和编辑管理应用程序的数据表。对于数据表,我首先使用了一个简单的 Grid 组件,按照这里找到的示例,然后我发现了这个很棒的vue-tables-2包,但是从 VueJS VM 的角度来看,主要操作原理几乎保持不变相同的。

所以在data我的虚拟机的对象中,我有一个columns数组,比如

其中每个元素代表每个记录对象的一个​​属性,即表的第 i 行包含从users[i]as users[i].nameusers[i].surname等获取的数据。当然,该users数组也在我的 VM 的dataObject 中。

在我的 HTML 中,我有类似的东西

其中<a>标记仅用于将uriashref用于链接。

原则上一切正常,但我的数据恰好是结构化的,因此每条记录的department字段依次是一个对象。

所以我的问题是:有没有人设法使用子对象的属性来呈现数据表?

这会很好,例如写这样的东西:

当然,这不起作用。我将 vue-tables-2 的主要 JSFiddle 演示分叉到这个 JSFiddle中,因此现在这些code字段是对象。有谁知道如何在表格中显示code.hash每条记录?

0 投票
0 回答
474 浏览

vue.js - 如何从(onclick)选定的行数据表vue js 2中获取1行值

您好,我没有任何示例可以尝试此方法.. 任何人都可以给我一些小示例,以从数据表(onclick)选择 vue js 的行中获取 1 行值。

这是我的模板表

这是我的 javascript

0 投票
4 回答
12545 浏览

vue.js - Vue + Vuetify 数据表第一列图片

我正在使用Vue + Vuetify,我正在尝试在第一列中添加图像。

表格模板代码

表脚本代码

我试图做的

我试图在name变量中添加HTML 图像代码,如下所示:

但它只是将 HTML 打印为文本并没有呈现它。

0 投票
0 回答
389 浏览

typescript - 如何从 Vuetify 数据表组件的类中获取数据?

我的数据表组件:

我的课:

我想将数据从 App 类传递到数据表。我怎样才能做到这一点?我认为将我的数据存储在不同的类实例中将是一个不错的解决方案,但我的代码现在也无法正常工作。什么是最简单的解决方案?

先感谢您!:)

0 投票
1 回答
1045 浏览

vue.js - Is there any way to modify vue-good-table pagination style?

vue-good-table allows pagination like following:

enter image description here

But I need pagination like below image:

enter image description here

Is there any way to have that pagination style using vue-good-table?

0 投票
1 回答
434 浏览

javascript - 根据选择项和搜索框搜索表格内容

我正在尝试为 vue js 中的数据表创建一个选择和搜索框。选择选项的项目是表格的列标题。当我们选择一个选项(一个列标题),并在输入框中进行搜索时,我们只需要在该特定列中进行搜索。比如ID、Name、Occupation是表中的三列,如果我们在select options中选择Name,就可以在输入字段中搜索名字。我在这里分享我的代码,任何人都可以帮我解决这个问题

我在代码中使用了 Vuetify 和 Vue js2

0 投票
1 回答
2225 浏览

vue.js - Vuetify 数据表手表不触发

在标题项单击时执行的“更改排序”功能不会触发监视,它会从服务器获取更新的数据。另一方面,如果我尝试在 changeSort 方法结束时执行 fetchRecords 方法,手表会被多次触发

我需要将 Vuetify 数据表与服务器端分页和排序以及标题和项目的模板一起使用。我实现了类似于 Vuetify 示例的代码:来自文档https://vuetifyjs.com/en/components/data-tables#api的“Paginate and sort server-side”和“Slot:items and headers” 。

0 投票
1 回答
1947 浏览

javascript - 有什么方法可以通过 Vue.js 覆盖点击事件

我目前正在使用 Vue-datatable,我有一个通用的 vue 组件作为 . 我正在使用这个基本组件来呈现数据表,并且我在元素中有一个 @click 事件。但是当我在不同的地方使用这个组件时,我希望 @click 事件被覆盖,这样我就可以根据我的需要调用不同的方法。

下面的文件是 BaseTable.vue

0 投票
1 回答
5045 浏览

vue.js - Vuetify v-data-table 拖放

我正在使用 V-data-table 和 vuex 存储。以下是我如何配置我的 v-data-table 的要点

  1. 每列禁用排序
  2. 将 v-data-table 项与 vuex 状态存储数据绑定
  3. 使用 sortablejs 拖放行

问题: 当我拖放 v-data-table 中的行时,我正在更新 vuex 存储(使用表行索引值更新数组中对象的索引值)。Vuex 正在正确更新,但在 v-data-table 中呈现的数据与它们在 vuex 状态存储中的顺序不同

有人可以帮我吗

我试图克服这个问题的最好方法是强制重新渲染 v-data-table 组件,但是当我这样做时,我不能再拖放了

使用以下模板强制渲染