Skip to content

Commit 308e517

Browse files
committed
Add vue/no-restricted-custom-event rule
1 parent 4a141ce commit 308e517

File tree

5 files changed

+688
-0
lines changed

5 files changed

+688
-0
lines changed

docs/rules/README.md

+1
Original file line numberDiff line numberDiff line change
@@ -301,6 +301,7 @@ For example:
301301
| [vue/no-potential-component-option-typo](./no-potential-component-option-typo.md) | disallow a potential typo in your component property | |
302302
| [vue/no-reserved-component-names](./no-reserved-component-names.md) | disallow the use of reserved names in component definitions | |
303303
| [vue/no-restricted-component-options](./no-restricted-component-options.md) | disallow specific component option | |
304+
| [vue/no-restricted-custom-event](./no-restricted-custom-event.md) | disallow specific custom event | |
304305
| [vue/no-restricted-static-attribute](./no-restricted-static-attribute.md) | disallow specific attribute | |
305306
| [vue/no-restricted-v-bind](./no-restricted-v-bind.md) | disallow specific argument in `v-bind` | |
306307
| [vue/no-static-inline-styles](./no-static-inline-styles.md) | disallow static inline `style` attributes | |
+97
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,97 @@
1+
---
2+
pageClass: rule-details
3+
sidebarDepth: 0
4+
title: vue/no-restricted-custom-event
5+
description: disallow specific custom event
6+
---
7+
# vue/no-restricted-custom-event
8+
> disallow specific custom event
9+
10+
## :book: Rule Details
11+
12+
This rule allows you to specify custom event that you don't want to use in your application.
13+
14+
## :wrench: Options
15+
16+
This rule takes a list of strings, where each string is a custom event name or pattern to be restricted:
17+
18+
```json
19+
{
20+
"vue/no-restricted-custom-event": ["error", "input", "/^forbidden/"]
21+
}
22+
```
23+
24+
<eslint-code-block :rules="{'vue/no-restricted-custom-event': ['error', 'input', '/^forbidden/']}">
25+
26+
```vue
27+
<template>
28+
<!-- ✗ BAD -->
29+
<input @input="$emit('input', $event.target.value)">
30+
<!-- ✗ GOOD -->
31+
<input @input="$emit('update:value', $event.target.value)">
32+
</template>
33+
<script>
34+
export default {
35+
methods: {
36+
handleChangeValue(newValue) {
37+
/* ✗ BAD */
38+
this.$emit('input', newValue)
39+
this.$emit('forbiddenEvent')
40+
41+
/* ✓ GOOD */
42+
this.$emit('foo')
43+
this.$emit('bar')
44+
}
45+
}
46+
}
47+
</script>
48+
```
49+
50+
</eslint-code-block>
51+
52+
53+
Alternatively, the rule also accepts objects.
54+
55+
```json
56+
{
57+
"vue/no-restricted-custom-event": ["error",
58+
{
59+
"event": "input",
60+
"message": "If you intend a prop for v-model, it should be 'update:modelValue' in Vue 3.",
61+
"suggest": "update:modelValue"
62+
},
63+
]
64+
}
65+
```
66+
67+
The following properties can be specified for the object.
68+
69+
- `event` ... Specify the event name or pattern.
70+
- `message` ... Specify an optional custom message.
71+
- `suggest` ... Specify an optional name to suggest changes.
72+
73+
<eslint-code-block :rules="{'vue/no-restricted-custom-event': ['error', { event: 'input', message: 'If you intend a prop for v-model, it should be \'update:modelValue\' in Vue 3.', suggest: 'update:modelValue'}]}">
74+
75+
```vue
76+
<template>
77+
<!-- ✗ BAD -->
78+
<input @input="$emit('input', $event.target.value)">
79+
</template>
80+
<script>
81+
export default {
82+
methods: {
83+
handleChangeValue(newValue) {
84+
/* ✗ BAD */
85+
this.$emit('input', newValue)
86+
}
87+
}
88+
}
89+
</script>
90+
```
91+
92+
</eslint-code-block>
93+
94+
## :mag: Implementation
95+
96+
- [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/no-restricted-custom-event.js)
97+
- [Test source](https://github.com/vuejs/eslint-plugin-vue/blob/master/tests/lib/rules/no-restricted-custom-event.js)

lib/index.js

+1
Original file line numberDiff line numberDiff line change
@@ -91,6 +91,7 @@ module.exports = {
9191
'no-reserved-component-names': require('./rules/no-reserved-component-names'),
9292
'no-reserved-keys': require('./rules/no-reserved-keys'),
9393
'no-restricted-component-options': require('./rules/no-restricted-component-options'),
94+
'no-restricted-custom-event': require('./rules/no-restricted-custom-event'),
9495
'no-restricted-static-attribute': require('./rules/no-restricted-static-attribute'),
9596
'no-restricted-syntax': require('./rules/no-restricted-syntax'),
9697
'no-restricted-v-bind': require('./rules/no-restricted-v-bind'),

0 commit comments

Comments
 (0)