Vuetify Datatable Select All Not Working with Regular v-checkbox

Posted 2023-02-22

【中文标题】Vuetify Datatable Select All Not Working with Regular v-checkbox

【英文标题】：Vuetify Datatable Select All Not Working With Regular v-checkbox

【发布时间】：2022-01-23 01:19:28

【问题描述】：

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

当我添加一个使用v-simple-checkbox 的模板时，复选框可以正常工作。您可以单击它并选择/取消选择所有行而不会出现问题。 Here is a Codepen showcasing this.

但是，如果我使用常规的 v-checkbox，则选择/取消选择所有功能将完全退出。 This Codepen showcases this.

由于v-on 似乎没有这样做，我必须将on 值挂钩到什么才能使其在这种情况下正常工作？或者有没有更简单的方法来自定义我缺少的这个复选框？

【参考方案1】：

像这样设置你的v-checkbox

<v-checkbox
   :input-value="props.value"
   :indeterminate="props.indeterminate"
   @change="on.input"
>
</v-checkbox>