Skip to content

Commit 9856621

Browse files
tyankatsu0105tyankatsu0105
authored
New: add no-use-computed-property-like-method rules (#1234)
* chore: init rule * feat: getable methodProperties * feat: move getMethodProperties into util * feat: pass rule * feat: remove getMethodProperties * docs: add docs * chore: run update * feat: check return type of data props methods computed * feat: add types to eslint utils getStaticValue * feat: refactor rule * docs: fix docs * docs: fix docs * feat: change report node * chore: remove unused file * refactor: improve JSDoc * docs: remove template * docs: fix docs * docs: fix docs * feat: change target node * feat: rename getComponentPropsType * rename eslint * refactor: rename PropertyMap * refactor: improve if statement * Revert "refactor: improve if statement" This reverts commit 8b825e5. * feat: consider basic props type * chore: run update * refactor improve selector * feat: addPropertyMap * refactor: use findProperty * refactor: add comment * feat: cover ThisExpression * feat: support return statement return nothing * fix: support undefined of propertyMap[thisMember] * style: run lint * test: add test case
1 parent 8c3031e commit 9856621

7 files changed

+1310
-3
lines changed

Diff for: ‎docs/rules/README.md

+2-1
Original file line numberDiff line numberDiff line change
@@ -320,6 +320,7 @@ For example:
320320
| [vue/no-unsupported-features](./no-unsupported-features.md) | disallow unsupported Vue.js syntax on the specified version | :wrench: |
321321
| [vue/no-unused-properties](./no-unused-properties.md) | disallow unused properties | |
322322
| [vue/no-unused-refs](./no-unused-refs.md) | disallow unused refs | |
323+
| [vue/no-use-computed-property-like-method](./no-use-computed-property-like-method.md) | disallow use computed property like method | |
323324
| [vue/no-useless-mustaches](./no-useless-mustaches.md) | disallow unnecessary mustache interpolations | :wrench: |
324325
| [vue/no-useless-v-bind](./no-useless-v-bind.md) | disallow unnecessary `v-bind` directives | :wrench: |
325326
| [vue/padding-line-between-blocks](./padding-line-between-blocks.md) | require or disallow padding lines between blocks | :wrench: |
@@ -366,7 +367,7 @@ The following rules extend the rules provided by ESLint itself and apply them to
366367
| [vue/no-restricted-syntax](./no-restricted-syntax.md) | disallow specified syntax | |
367368
| [vue/no-sparse-arrays](./no-sparse-arrays.md) | disallow sparse arrays | |
368369
| [vue/no-useless-concat](./no-useless-concat.md) | disallow unnecessary concatenation of literals or template literals | |
369-
| [vue/object-curly-newline](./object-curly-newline.md) | enforce consistent line breaks after opening and before closing braces | :wrench: |
370+
| [vue/object-curly-newline](./object-curly-newline.md) | enforce consistent line breaks inside braces | :wrench: |
370371
| [vue/object-curly-spacing](./object-curly-spacing.md) | enforce consistent spacing inside braces | :wrench: |
371372
| [vue/object-property-newline](./object-property-newline.md) | enforce placing object properties on separate lines | :wrench: |
372373
| [vue/operator-linebreak](./operator-linebreak.md) | enforce consistent linebreak style for operators | :wrench: |

Diff for: ‎docs/rules/no-use-computed-property-like-method.md

+340
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,340 @@
1+
---
2+
pageClass: rule-details
3+
sidebarDepth: 0
4+
title: vue/no-use-computed-property-like-method
5+
description: disallow use computed property like method
6+
---
7+
# vue/no-use-computed-property-like-method
8+
9+
> disallow use computed property like method
10+
11+
- :exclamation: <badge text="This rule has not been released yet." vertical="middle" type="error"> ***This rule has not been released yet.*** </badge>
12+
13+
## :book: Rule Details
14+
15+
This rule disallows to use computed property like method.
16+
17+
<eslint-code-block :rules="{'vue/no-use-computed-property-like-method': ['error']}">
18+
19+
```vue
20+
<script>
21+
export default {
22+
data() {
23+
return {
24+
dataString: 'dataString',
25+
dataNumber: 10,
26+
dataObject: {
27+
inside: 'inside'
28+
},
29+
dataArray: [1, 2, 3, 4, 5],
30+
dataBoolean: true,
31+
dataFunction() {
32+
alert('dataFunction')
33+
}
34+
}
35+
},
36+
props: {
37+
propsString: String,
38+
propsNumber: Number,
39+
propsObject: Object,
40+
propsArray: Array,
41+
propsBoolean: Boolean,
42+
propsFunction: Function,
43+
44+
objectPropsString: {
45+
type: String
46+
},
47+
objectPropsNumber: {
48+
type: Number
49+
},
50+
objectPropsObject: {
51+
type: Object
52+
},
53+
objectPropsArray: {
54+
type: Array
55+
},
56+
objectPropsBoolean: {
57+
type: Boolean
58+
},
59+
objectPropsFunction: {
60+
type: Function
61+
}
62+
},
63+
computed: {
64+
computedReturnDataString() {
65+
return this.dataString
66+
},
67+
computedReturnDataNumber() {
68+
return this.dataNumber
69+
},
70+
computedReturnDataObject() {
71+
return this.dataObject
72+
},
73+
computedReturnDataArray() {
74+
return this.dataArray
75+
},
76+
computedReturnDataBoolean() {
77+
return this.dataBoolean
78+
},
79+
computedReturnDataFunction() {
80+
return this.dataFunction
81+
},
82+
83+
computedReturnPropsString() {
84+
return this.propsString
85+
},
86+
computedReturnPropsNumber() {
87+
return this.propsNumber
88+
},
89+
computedReturnPropsObject() {
90+
return this.propsObject
91+
},
92+
computedReturnPropsArray() {
93+
return this.propsArray
94+
},
95+
computedReturnPropsBoolean() {
96+
return this.propsBoolean
97+
},
98+
computedReturnPropsFunction() {
99+
return this.propsFunction
100+
},
101+
102+
computedReturnObjectPropsString() {
103+
return this.objectPropsString
104+
},
105+
computedReturnObjectPropsNumber() {
106+
return this.objectPropsNumber
107+
},
108+
computedReturnObjectPropsObject() {
109+
return this.objectPropsObject
110+
},
111+
computedReturnObjectPropsArray() {
112+
return this.objectPropsArray
113+
},
114+
computedReturnObjectPropsBoolean() {
115+
return this.objectPropsBoolean
116+
},
117+
computedReturnObjectPropsFunction() {
118+
return this.objectPropsFunction
119+
},
120+
121+
computedReturnString() {
122+
return 'computedReturnString'
123+
},
124+
computedReturnNumber() {
125+
return 10
126+
},
127+
computedReturnObject() {
128+
return {
129+
inside: 'inside'
130+
}
131+
},
132+
computedReturnArray() {
133+
return [1, 2, 3, 4, 5]
134+
},
135+
computedReturnBoolean() {
136+
return true
137+
},
138+
computedReturnFunction() {
139+
const fn = () => alert('computedReturnFunction')
140+
return fn
141+
},
142+
143+
computedReturnMethodsReturnString() {
144+
return this.methodsReturnString
145+
},
146+
computedReturnMethodsReturnNumber() {
147+
return this.methodsReturnNumber
148+
},
149+
computedReturnMethodsReturnObject() {
150+
return this.methodsReturnObject
151+
},
152+
computedReturnMethodsReturnArray() {
153+
return this.methodsReturnArray
154+
},
155+
computedReturnMethodsReturnBoolean() {
156+
return this.methodsReturnBoolean
157+
},
158+
computedReturnMethodsReturnFunction() {
159+
return this.methodsReturnFunction
160+
}
161+
},
162+
methods: {
163+
methodsReturnString() {
164+
return 'methodsReturnString'
165+
},
166+
methodsReturnNumber() {
167+
return 'methodsReturnNumber'
168+
},
169+
methodsReturnObject() {
170+
return {
171+
inside: 'inside'
172+
}
173+
},
174+
methodsReturnArray() {
175+
return [1, 2, 3, 4, 5]
176+
},
177+
methodsReturnBoolean() {
178+
return true
179+
},
180+
methodsReturnFunction() {
181+
const fn = () => alert('methodsReturnFunction')
182+
return fn
183+
},
184+
185+
fn() {
186+
/* Reference data */
187+
/* ✓ GOOD */
188+
this.computedReturnDataString
189+
this.computedReturnDataNumber
190+
this.computedReturnDataObject
191+
this.computedReturnDataArray
192+
this.computedReturnDataBoolean
193+
this.computedReturnDataFunction
194+
this.computedReturnDataFunction()
195+
/* ✗ BAD */
196+
this.computedReturnDataString()
197+
this.computedReturnDataNumber()
198+
this.computedReturnDataObject()
199+
this.computedReturnDataArray()
200+
this.computedReturnDataBoolean()
201+
202+
/* Reference props */
203+
/* ✓ GOOD */
204+
this.computedReturnPropsString
205+
this.computedReturnPropsNumber
206+
this.computedReturnPropsObject
207+
this.computedReturnPropsArray
208+
this.computedReturnPropsBoolean
209+
this.computedReturnPropsFunction
210+
this.computedReturnPropsFunction()
211+
/* ✗ BAD */
212+
this.computedReturnPropsString()
213+
this.computedReturnPropsNumber()
214+
this.computedReturnPropsObject()
215+
this.computedReturnPropsArray()
216+
this.computedReturnPropsBoolean()
217+
218+
/* ✓ GOOD */
219+
this.computedReturnObjectPropsString
220+
this.computedReturnObjectPropsNumber
221+
this.computedReturnObjectPropsObject
222+
this.computedReturnObjectPropsArray
223+
this.computedReturnObjectPropsBoolean
224+
this.computedReturnObjectPropsFunction
225+
this.computedReturnObjectPropsFunction()
226+
/* ✗ BAD */
227+
this.computedReturnObjectPropsString()
228+
this.computedReturnObjectPropsNumber()
229+
this.computedReturnObjectPropsObject()
230+
this.computedReturnObjectPropsArray()
231+
this.computedReturnObjectPropsBoolean()
232+
233+
/* Reference computed */
234+
/* ✓ GOOD */
235+
this.computedReturnString
236+
this.computedReturnNumber
237+
this.computedReturnObject
238+
this.computedReturnArray
239+
this.computedReturnBoolean
240+
this.computedReturnFunction
241+
this.computedReturnFunction()
242+
/* ✗ BAD */
243+
this.computedReturnString()
244+
this.computedReturnNumber()
245+
this.computedReturnObject()
246+
this.computedReturnArray()
247+
this.computedReturnBoolean()
248+
249+
/* Reference methods */
250+
/* ✓ GOOD */
251+
this.computedReturnMethodsReturnString
252+
this.computedReturnMethodsReturnNumber
253+
this.computedReturnMethodsReturnObject
254+
this.computedReturnMethodsReturnArray
255+
this.computedReturnMethodsReturnBoolean
256+
this.computedReturnMethodsReturnFunction
257+
this.computedReturnMethodsReturnFunction()
258+
/* ✗ BAD */
259+
this.computedReturnMethodsReturnString()
260+
this.computedReturnMethodsReturnNumber()
261+
this.computedReturnMethodsReturnObject()
262+
this.computedReturnMethodsReturnArray()
263+
this.computedReturnMethodsReturnBoolean()
264+
}
265+
}
266+
}
267+
</script>
268+
```
269+
270+
</eslint-code-block>
271+
272+
This rule can't check if props is used as array:
273+
274+
<eslint-code-block :rules="{'vue/no-use-computed-property-like-method': ['error']}">
275+
276+
```vue
277+
<script>
278+
export default {
279+
props: [
280+
'propsString',
281+
'propsNumber',
282+
'propsObject',
283+
'propsArray',
284+
'propsBoolean',
285+
'propsFunction'
286+
],
287+
computed: {
288+
computedReturnPropsString() {
289+
return this.propsString
290+
},
291+
computedReturnPropsNumber() {
292+
return this.propsNumber
293+
},
294+
computedReturnPropsObject() {
295+
return this.propsObject
296+
},
297+
computedReturnPropsArray() {
298+
return this.propsArray
299+
},
300+
computedReturnPropsBoolean() {
301+
return this.propsBoolean
302+
},
303+
computedReturnPropsFunction() {
304+
return this.propsFunction
305+
}
306+
},
307+
methods: {
308+
fn() {
309+
/* Reference props */
310+
/* ✓ GOOD */
311+
this.computedReturnPropsString
312+
this.computedReturnPropsString()
313+
this.computedReturnPropsNumber
314+
this.computedReturnPropsNumber()
315+
this.computedReturnPropsObject
316+
this.computedReturnPropsObject()
317+
this.computedReturnPropsArray
318+
this.computedReturnPropsArray()
319+
this.computedReturnPropsBoolean
320+
this.computedReturnPropsBoolean()
321+
this.computedReturnPropsFunction
322+
this.computedReturnPropsFunction()
323+
/* ✗ BAD */
324+
/* Nope. everything is GOOD!! */
325+
}
326+
}
327+
}
328+
</script>
329+
```
330+
331+
</eslint-code-block>
332+
333+
## :wrench: Options
334+
335+
Nothing.
336+
337+
## :mag: Implementation
338+
339+
- [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/no-use-computed-property-like-method.js)
340+
- [Test source](https://github.com/vuejs/eslint-plugin-vue/blob/master/tests/lib/rules/no-use-computed-property-like-method.js)

Diff for: ‎docs/rules/object-curly-newline.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,12 @@
22
pageClass: rule-details
33
sidebarDepth: 0
44
title: vue/object-curly-newline
5-
description: enforce consistent line breaks after opening and before closing braces
5+
description: enforce consistent line breaks inside braces
66
since: v7.0.0
77
---
88
# vue/object-curly-newline
99

10-
> enforce consistent line breaks after opening and before closing braces
10+
> enforce consistent line breaks inside braces
1111
1212
- :wrench: The `--fix` option on the [command line](https://eslint.org/docs/user-guide/command-line-interface#fixing-problems) can automatically fix some of the problems reported by this rule.
1313

Diff for: ‎lib/index.js

+1
Original file line numberDiff line numberDiff line change
@@ -122,6 +122,7 @@ module.exports = {
122122
'no-unused-properties': require('./rules/no-unused-properties'),
123123
'no-unused-refs': require('./rules/no-unused-refs'),
124124
'no-unused-vars': require('./rules/no-unused-vars'),
125+
'no-use-computed-property-like-method': require('./rules/no-use-computed-property-like-method'),
125126
'no-use-v-if-with-v-for': require('./rules/no-use-v-if-with-v-for'),
126127
'no-useless-concat': require('./rules/no-useless-concat'),
127128
'no-useless-mustaches': require('./rules/no-useless-mustaches'),

0 commit comments

Comments
 (0)