New: add no-use-computed-property-like-method rules

.tool-versions

@@ -0,0 +1 @@
+nodejs 12.18.0

docs/rules/README.md

@@ -308,6 +308,7 @@ For example:
 | [vue/no-unregistered-components](./no-unregistered-components.md) | disallow using components that are not registered inside templates |  |
 | [vue/no-unsupported-features](./no-unsupported-features.md) | disallow unsupported Vue.js syntax on the specified version | :wrench: |
 | [vue/no-unused-properties](./no-unused-properties.md) | disallow unused properties |  |
+| [vue/no-use-computed-property-like-method](./no-use-computed-property-like-method.md) | disallow use computed property like method |  |
 | [vue/no-useless-mustaches](./no-useless-mustaches.md) | disallow unnecessary mustache interpolations | :wrench: |
 | [vue/no-useless-v-bind](./no-useless-v-bind.md) | disallow unnecessary `v-bind` directives | :wrench: |
 | [vue/padding-line-between-blocks](./padding-line-between-blocks.md) | require or disallow padding lines between blocks | :wrench: |

docs/rules/no-use-computed-property-like-method.md

@@ -0,0 +1,55 @@
+---
+pageClass: rule-details
+sidebarDepth: 0
+title: vue/no-use-computed-property-like-method
+description: disallow use computed property like method
+---
+# vue/no-use-computed-property-like-method
+> disallow use computed property like method
+
+## :book: Rule Details
+
+This rule disallows to use computed property like method.  
+
+<eslint-code-block :rules="{'vue/no-use-computed-property-like-method': ['error']}">
+
+```vue
+<template>
+  <div>
+  </div>
+</template>
+
+<script>
+  export default {
+    props: {
+      name: {
+        type: String
+      },
+    },
+    computed: {
+      isExpectedName() {
+        return this.name === 'name';
+      }
+    },
+    methods: {
+      getName() {
+        return this.isExpectedName
+      },
+      getNameCallLikeMethod() {
+        return this.isExpectedName()
+      }
+    }
+  }
+</script>
+```
+
+</eslint-code-block>
+
+## :wrench: Options
+
+Nothing.
+
+## :mag: Implementation
+
+- [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/no-use-computed-property-like-method.js)
+- [Test source](https://github.com/vuejs/eslint-plugin-vue/blob/master/tests/lib/rules/no-use-computed-property-like-method.js)

lib/index.js

@@ -107,6 +107,7 @@ module.exports = {
     'no-unused-components': require('./rules/no-unused-components'),
     'no-unused-properties': require('./rules/no-unused-properties'),
     'no-unused-vars': require('./rules/no-unused-vars'),
+    'no-use-computed-property-like-method': require('./rules/no-use-computed-property-like-method'),
     'no-use-v-if-with-v-for': require('./rules/no-use-v-if-with-v-for'),
     'no-useless-concat': require('./rules/no-useless-concat'),
     'no-useless-mustaches': require('./rules/no-useless-mustaches'),

lib/rules/no-use-computed-property-like-method.js

@@ -0,0 +1,74 @@
+/**
+ * @author tyankatsu <https://github.com/tyankatsu0105>
+ * See LICENSE file in root directory for full license.
+ */
+'use strict'
+
+// ------------------------------------------------------------------------------
+// Requirements
+// ------------------------------------------------------------------------------
+
+const { defineVueVisitor, getComputedProperties } = require('../utils')
+
+/**
+ * @typedef {import('../utils').ComponentComputedProperty} ComponentComputedProperty
+ * @typedef {import('../utils').ComponentObjectProp} ComponentObjectProp
+ */
+
+// ------------------------------------------------------------------------------
+// Rule Definition
+// ------------------------------------------------------------------------------
+
+module.exports = {
+  meta: {
+    type: 'problem',
+    docs: {
+      description: 'disallow use computed property like method',
+      categories: undefined,
+      url:
+        'https://eslint.vuejs.org/rules/no-use-computed-property-like-method.html'
+    },
+    fixable: null,
+    schema: [],
+    messages: {
+      unexpected: 'Does not allow to use computed with this expression.'
+    }
+  },
+  /** @param {RuleContext} context */
+  create(context) {
+    /**
+     * @typedef {object} ScopeStack
+     * @property {ScopeStack | null} upper
+     * @property {BlockStatement | Expression} body
+     */
+    /** @type {Map<ObjectExpression, ComponentComputedProperty[]>} */
+    const computedPropertiesMap = new Map()
+
+    return defineVueVisitor(context, {
+      onVueObjectEnter(node) {
+        computedPropertiesMap.set(node, getComputedProperties(node))
+      },
+
+      /** @param {MemberExpression} node */
+      'MemberExpression[object.type="ThisExpression"]'(
+        node,
+        { node: vueNode }
+      ) {
+        if (node.property.type !== 'Identifier') return
+        if (node.parent.type !== 'CallExpression') return
+
+        const computedProperties = computedPropertiesMap
+          .get(vueNode)
+          .map((item) => item.key)
+
+        if (!computedProperties.includes(node.property.name)) return
+
+        context.report({
+          node: node.property,
+          loc: node.property.loc,
+          messageId: 'unexpected'
+        })
+      }
+    })
+  }
+}

tests/lib/rules/no-use-computed-property-like-method.js

@@ -0,0 +1,137 @@
+/**
+ * @author tyankatsu <https://github.com/tyankatsu0105>
+ * See LICENSE file in root directory for full license.
+ */
+
+// ------------------------------------------------------------------------------
+// Requirements
+// ------------------------------------------------------------------------------
+
+const RuleTester = require('eslint').RuleTester
+const rule = require('../../../lib/rules/no-use-computed-property-like-method')
+
+// ------------------------------------------------------------------------------
+// Tests
+// ------------------------------------------------------------------------------
+
+const tester = new RuleTester({
+  parser: require.resolve('vue-eslint-parser'),
+  parserOptions: { ecmaVersion: 2015, sourceType: 'module' }
+})
+
+tester.run('no-use-computed-property-like-method', rule, {
+  valid: [
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          computed: {
+            name() {
+              return 'name';
+            }
+          },
+          methods: {
+            getName() {
+              return this.name
+            }
+          },
+        }
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          props: {
+            name: {
+              type: String
+            },
+          },
+          computed: {
+            isExpectedName() {
+              return this.name === 'name';
+            }
+          },
+          methods: {
+            getName() {
+              return this.isExpectedName
+            }
+          },
+        }
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          computed: {
+            name() {
+              return 'name';
+            },
+            isExpectedName() {
+              return this.name === 'name';
+            }
+          },
+          methods: {
+            getName() {
+              return this.isExpectedName
+            }
+          },
+        }
+      </script>
+      `
+    }
+  ],
+  invalid: [
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          computed: {
+            name() {
+              return 'name';
+            }
+          },
+          methods: {
+            getName() {
+              return this.name()
+            }
+          }
+        }
+      </script>
+      `,
+      errors: ['Does not allow to use computed with this expression.']
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          props: {
+            name: {
+              type: String
+            },
+          },
+          computed: {
+            isExpectedName() {
+              return this.name === 'name';
+            }
+          },
+          methods: {
+            getName() {
+              return this.isExpectedName()
+            }
+          }
+        }
+      </script>
+      `,
+      errors: ['Does not allow to use computed with this expression.']
+    }
+  ]
+})