eslint-plugin-vue

外观

vue/custom-event-name-casing ​

强制自定义事件名称使用特定大小写

定义自定义事件名称大小写样式，以确保一致性。

📖 规则详情 ​

此规则旨在警告除配置大小写之外的自定义事件名称。（默认值为 **camelCase**。）

Vue 2 建议对自定义事件名称使用 kebab-case。

事件名称永远不会在 JavaScript 中用作变量或属性名称，因此没有理由使用 camelCase 或 PascalCase。此外，DOM 模板中的 v-on 事件监听器将自动转换为小写（由于 HTML 的不区分大小写），因此 v-on:myEvent 将变为 v-on:myevent - 使 myEvent 无法监听。

出于这些原因，我们建议您 **始终对事件名称使用 kebab-case**。

有关更多详细信息，请参阅 指南（适用于 v2） - 自定义事件。

在 Vue 3 中，对自定义事件名称使用 camelCase 或 kebab-case 不会限制其在 v-on 中的使用。但是，遵循 JavaScript 约定，camelCase 更自然。

有关更多详细信息，请参阅 指南 - 自定义事件。

此规则默认强制使用 camelCase。

正在加载中...

🔧 选项 ​

json
{
  "vue/custom-event-name-casing": ["error",
    "camelCase" | "kebab-case",
    {
      "ignores": []
    }
  ]
}
  • "camelCase" (默认) ... 强制自定义事件名称为 camelCase。
  • "kebab-case" ... 强制自定义事件名称为 kebab-case。
  • ignores (string[]) ... 要忽略的事件名称。设置允许的事件名称。例如，自定义事件名称、具有特殊名称的 Vue 组件事件或 Vue 库组件事件名称。您可以通过像 "/^name/" 或 click:row 或 fooBar 那样编写来设置正则表达式。

"kebab-case" ​

正在加载中...

"camelCase" ​

正在加载中...

"ignores": ["foo-bar", "/^[a-z]+(?:-[a-z]+)*:[a-z]+(?:-[a-z]+)*$/u"] ​

正在加载中...

📚 进一步阅读 ​

🚀 版本 ​

此规则是在 eslint-plugin-vue v7.0.0 中引入的

🔍 实现 ​