Vuetify - v-simple-checkbox 防止 v-data-table row.click 事件

如何解决Vuetify - v-simple-checkbox 防止 v-data-table row.click 事件

在 v-simple-checkBox 中使用 v-data-table 时，单击复选框或其周围区域不会调用 row.click 事件。

此 CodePen 示例显示在 row.click 上选择数据表行。但是，如果使用更多带有复选框的列，则几乎不可能选择一行。

似乎在 .stop 中使用了 v-simple-checkBox 事件处理程序。有没有办法通过点击该组件来触发 row.click 事件？

解决方法

如果最后一列复选框仅用于显示，您可以使用 v-icon 来呈现正确的复选框图标。

<template v-slot:item.glutenfree="{ value }">
    <v-icon>
        {{ value ? 'mdi-checkbox-marked' : 'mdi-checkbox-blank-outline' }}
    </v-icon>
</template>