“v-slot”指令不支持任何修饰符

2022-08-30 05:26:39

我正在使用vuetify的datatable,我这个我们有不同的插槽和一些道具,例如下面

<template  #header.data-table-select="{ on, props }">
    <v-simple-checkbox color="purple" v-bind="props" v-on="on"></v-simple-checkbox>
</template>

我也使用vue的eslint插件来检查任何错误/错误代码/或任何违规行为,但是如果我在我的文件中使用上面的代码片段,它会给我错误

“v-slot”指令不支持任何修饰符

根据此文档,它是正确的 https://eslint.vuejs.org/rules/valid-v-slot.html

但它没有任何例子来说明我们如何处理这种情况

我怎么能删除这个警告/或使它正确的方式,而不让它豁免

谢谢


答案 1

我在您提供的代码中没有看到任何内容,因此我只能向您显示我的用例。v-slot

使用 Eslint 错误:

<template v-slot:item.actions="{ item }">

无错误:

<template v-slot:[`item.actions`]="{ item }">

答案 2

在 中,可以使用规则中的选项。eslint-plugin-vue@^7.1.0allowModifiersvue/valid-v-slot

// .eslintrc.js
'vue/valid-v-slot': ['error', {
  allowModifiers: true,
}],

vue/valid-v-slot #options