Skip to content

Commit d0e8e47

Browse files
ota-meshiarmano2
andauthored
Add vue/no-mutating-props rule (from #633) (#1148)
* Add `no-mutating-props` rule. * update * support vue3 * delete unused function Co-authored-by: Armano <[email protected]>
1 parent c47fa77 commit d0e8e47

File tree

8 files changed

+1124
-0
lines changed

8 files changed

+1124
-0
lines changed

Diff for: docs/rules/README.md

+2
Original file line numberDiff line numberDiff line change
@@ -56,6 +56,7 @@ Enforce all the rules in this category, as well as all higher priority rules, wi
5656
| [vue/no-dupe-keys](./no-dupe-keys.md) | disallow duplication of field names | |
5757
| [vue/no-duplicate-attributes](./no-duplicate-attributes.md) | disallow duplication of attributes | |
5858
| [vue/no-lifecycle-after-await](./no-lifecycle-after-await.md) | disallow asynchronously registered lifecycle hooks | |
59+
| [vue/no-mutating-props](./no-mutating-props.md) | disallow mutation of component props | |
5960
| [vue/no-parsing-error](./no-parsing-error.md) | disallow parsing errors in `<template>` | |
6061
| [vue/no-ref-as-operand](./no-ref-as-operand.md) | disallow use of value wrapped by `ref()` (Composition API) as an operand | |
6162
| [vue/no-reserved-keys](./no-reserved-keys.md) | disallow overwriting reserved keys | |
@@ -163,6 +164,7 @@ Enforce all the rules in this category, as well as all higher priority rules, wi
163164
| [vue/no-dupe-keys](./no-dupe-keys.md) | disallow duplication of field names | |
164165
| [vue/no-duplicate-attributes](./no-duplicate-attributes.md) | disallow duplication of attributes | |
165166
| [vue/no-multiple-template-root](./no-multiple-template-root.md) | disallow adding multiple root nodes to the template | |
167+
| [vue/no-mutating-props](./no-mutating-props.md) | disallow mutation of component props | |
166168
| [vue/no-parsing-error](./no-parsing-error.md) | disallow parsing errors in `<template>` | |
167169
| [vue/no-reserved-keys](./no-reserved-keys.md) | disallow overwriting reserved keys | |
168170
| [vue/no-shared-component-data](./no-shared-component-data.md) | enforce component's data property to be a function | :wrench: |

Diff for: docs/rules/no-mutating-props.md

+99
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,99 @@
1+
---
2+
pageClass: rule-details
3+
sidebarDepth: 0
4+
title: vue/no-mutating-props
5+
description: disallow mutation of component props
6+
---
7+
# vue/no-mutating-props
8+
> disallow mutation of component props
9+
10+
- :gear: This rule is included in all of `"plugin:vue/vue3-essential"`, `"plugin:vue/essential"`, `"plugin:vue/vue3-strongly-recommended"`, `"plugin:vue/strongly-recommended"`, `"plugin:vue/vue3-recommended"` and `"plugin:vue/recommended"`.
11+
12+
## :book: Rule Details
13+
14+
This rule reports mutation of component props.
15+
16+
<eslint-code-block :rules="{'vue/no-mutating-props': ['error']}">
17+
18+
```vue
19+
<!-- ✗ BAD -->
20+
<template>
21+
<div>
22+
<input v-model="value" @click="openModal">
23+
</div>
24+
</template>
25+
<script>
26+
export default {
27+
props: {
28+
value: {
29+
type: String,
30+
required: true
31+
}
32+
},
33+
methods: {
34+
openModal() {
35+
this.value = 'test'
36+
}
37+
}
38+
}
39+
</script>
40+
```
41+
42+
</eslint-code-block>
43+
44+
<eslint-code-block :rules="{'vue/no-mutating-props': ['error']}">
45+
46+
```vue
47+
<!-- ✓ GOOD -->
48+
<template>
49+
<div>
50+
<input :value="value" @input="$emit('input', $event.target.value)" @click="openModal">
51+
</div>
52+
</template>
53+
<script>
54+
export default {
55+
props: {
56+
value: {
57+
type: String,
58+
required: true
59+
}
60+
},
61+
methods: {
62+
openModal() {
63+
this.$emit('input', 'test')
64+
}
65+
}
66+
}
67+
</script>
68+
```
69+
70+
</eslint-code-block>
71+
72+
<eslint-code-block :rules="{'vue/no-mutating-props': ['error']}">
73+
74+
```vue
75+
<script>
76+
export default {
77+
setup (props) {
78+
// ✗ BAD
79+
props.value = 'test'
80+
}
81+
}
82+
</script>
83+
```
84+
85+
</eslint-code-block>
86+
87+
## :wrench: Options
88+
89+
Nothing.
90+
91+
## :books: Further reading
92+
93+
- [Vue - Prop Mutation - deprecated](https://vuejs.org/v2/guide/migration.html#Prop-Mutation-deprecated)
94+
- [Style guide - Implicit parent-child communication](https://vuejs.org/v2/style-guide/#Implicit-parent-child-communication-use-with-caution)
95+
96+
## :mag: Implementation
97+
98+
- [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/no-mutating-props.js)
99+
- [Test source](https://github.com/vuejs/eslint-plugin-vue/blob/master/tests/lib/rules/no-mutating-props.js)

Diff for: lib/configs/essential.js

+1
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ module.exports = {
1111
'vue/no-dupe-keys': 'error',
1212
'vue/no-duplicate-attributes': 'error',
1313
'vue/no-multiple-template-root': 'error',
14+
'vue/no-mutating-props': 'error',
1415
'vue/no-parsing-error': 'error',
1516
'vue/no-reserved-keys': 'error',
1617
'vue/no-shared-component-data': 'error',

Diff for: lib/configs/vue3-essential.js

+1
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ module.exports = {
2424
'vue/no-dupe-keys': 'error',
2525
'vue/no-duplicate-attributes': 'error',
2626
'vue/no-lifecycle-after-await': 'error',
27+
'vue/no-mutating-props': 'error',
2728
'vue/no-parsing-error': 'error',
2829
'vue/no-ref-as-operand': 'error',
2930
'vue/no-reserved-keys': 'error',

Diff for: lib/index.js

+1
Original file line numberDiff line numberDiff line change
@@ -66,6 +66,7 @@ module.exports = {
6666
'no-lifecycle-after-await': require('./rules/no-lifecycle-after-await'),
6767
'no-multi-spaces': require('./rules/no-multi-spaces'),
6868
'no-multiple-template-root': require('./rules/no-multiple-template-root'),
69+
'no-mutating-props': require('./rules/no-mutating-props'),
6970
'no-parsing-error': require('./rules/no-parsing-error'),
7071
'no-potential-component-option-typo': require('./rules/no-potential-component-option-typo'),
7172
'no-ref-as-operand': require('./rules/no-ref-as-operand'),

0 commit comments

Comments
 (0)