问题标签 [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 回答
84 浏览

vuejs2 - Vuetify 表 (v 2.6.3)

我是 Vue.js 和 Vuetify 的初学者:

  1. 我有一个 Vuetify 数据表,我正在尝试将不同的图标(来自 flaticon 的自定义图标)附加到列中,例如“fat (g)”。意味着每条新线都有自己的图标。

  2. 此外,我喜欢在 v-table-header 中有一个标题而不是复选标记。

如何在以下代码中执行此操作?

示例代码: https ://github.com/vuetifyjs/vuetify/blob/master/packages/docs/src/examples/v-data-table/prop-row-selection.vue :

0 投票
1 回答
40 浏览

javascript - How to trigger sort function in custom v-data-table column headers?

I have a v-data-table that groups items. When using a custom header with v-slot like below - how do I enable the built in sort functionality that's on the default header?

is there a way I can trigger the built in sort function with my sortThisColumn function, or any other way? At the moment, my table headings are unclickable.

Table headers:-

0 投票
0 回答
18 浏览

javascript - 使用 vuetify v-data-table 在一行中显示三行重复数据

您可以在附图中看到两个数据表。第一个数据表在所有三行中显示相同的数据。我不需要重复的数据,所以我想删除重复的数据行并只制作一行数据。请告诉我该怎么办。大家请帮帮我。

本项目使用vuetify框架,下面的代码是“v-data-table”和“v-card”组件的一部分。也许如果这部分修复得好,可以制作只有一行和标题的数据表,但可能还需要修复 Javascript 部分。

0 投票
1 回答
31 浏览

css - Vuetify nested data table alignments

I have got a vuetify data table with expandable rows. When expanded, I want to show a data table within the expanded section that has the exact same columns as the main one. I am having trouble with aligning the columns, I just can't seem to align them.

I have tried adding another data table within the parent one, adding a full <table> or only <tr>s and/or <td>s but no luck.

The result so far is

nested tables

You can see that the nested table is not aligned with the parent one, the figures are out of place.

Here is where I got so far (CodePen):

And

EDIT

I got to the solution based on @Oleg's answer. Thanks @Oleg.

0 投票
1 回答
25 浏览

javascript - 验证数据表的行数未达到表的全高

我正在尝试使用带有固定页眉和页脚的 v-data-table。但是我有一个问题,如果我为表格定义的高度大于行的高度,表格将采用我定义的高度,并且页脚远离行。

这是一个代码笔

有没有聪明的方法来解决这个问题?

的HTML

JS