VueJs 2.6.11 + Vuetify - vdata-table - BUG?? - 即使 headers 被隐藏，我如何保持宽度列？

Question

我有同样的问题，但使用 Vuejs2：Vuetify v1.5 data table, how to determine column widths when the header is hidden

这是我的资料：

<v-data-table 
:headers="headers" 
:items="items"
item-key="id"
hide-default-footer 
disable-pagination 
:hide-default-header="false"
>

对于headers：

headers: [
  { text: 'a', value: 'a', width: "4%" },
  { text: 'b', value: 'b', width: "4%" },
  { text: 'c', value: 'c', width: "7%" },
  { text: 'd', value: 'd', width: "10%" },
  { text: 'e', value: 'e', width: "8%" },
  { text: 'f', value: 'f', width: "13%" },
  { text: 'g', value: 'g', width: "10%" },
  { text: 'h', value: 'h', width: "13%" },
  { text: 'i', value: 'i', width: "31%" }
]

宽度总和为 100%，因此不会出现奇怪的行为。当我设置 :hide-default-header="true" 时，所有列的宽度都会改变。我怎样才能强制列的宽度 ??

Answer 1

我最终使用 refs 在我的方法中访问 DOM 并从代码中修改它。它有效，但它是垃圾代码...

VueJs 2.6.11 + Vuetify - vdata-table - BUG?? - 即使 headers 被隐藏，我如何保持宽度列？

VueJs 2.6.11 + Vuetify - vdata-table - BUG?? - How do I keep width columns even when headers are hidden?

javascript

vue.js

vuejs2

vuetify.js

v-data-table