Fix false negatives for member access with $ in `vue/this-in-templa…

…te` rule (#1446)
vuejs · Mar 2, 2021 · 467ef96 · 467ef96
1 parent 7099954
commit 467ef96
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 1 deletion.
diff --git a/lib/rules/this-in-template.js b/lib/rules/this-in-template.js
@@ -83,7 +83,7 @@ module.exports = {
                 !propertyName ||
                 scopeStack.nodes.some((el) => el.name === propertyName) ||
                 RESERVED_NAMES.has(propertyName) || // this.class | this['class']
-                /^[0-9].*$|[^a-zA-Z0-9_]/.test(propertyName) // this['0aaaa'] | this['foo-bar bas']
+                /^[0-9].*$|[^a-zA-Z0-9_$]/.test(propertyName) // this['0aaaa'] | this['foo-bar bas']
               ) {
                 return
               }

diff --git a/tests/lib/rules/this-in-template.js b/tests/lib/rules/this-in-template.js
@@ -222,4 +222,16 @@ ruleTester.run('this-in-template', rule, {
     .concat(
       createInvalidTests('', ['always'], "Expected 'this'.", 'Identifier')
     )
+    .concat([
+      {
+        code: `<template><div v-if="fn(this.$foo)"></div></template><!-- never -->`,
+        errors: ["Unexpected usage of 'this'."],
+        options: ['never']
+      },
+      {
+        code: `<template><div :class="{ foo: this.$foo }"></div></template><!-- never -->`,
+        errors: ["Unexpected usage of 'this'."],
+        options: ['never']
+      }
+    ])
 })