diff --git a/lib/rules/no-setup-props-reactivity-loss.js b/lib/rules/no-setup-props-reactivity-loss.js index b8e896075..4c3be8b90 100644 --- a/lib/rules/no-setup-props-reactivity-loss.js +++ b/lib/rules/no-setup-props-reactivity-loss.js @@ -79,18 +79,35 @@ module.exports = { left.type !== 'ArrayPattern' && left.type !== 'ObjectPattern' && rightNode.type !== 'MemberExpression' && - rightNode.type !== 'ConditionalExpression' + rightNode.type !== 'ConditionalExpression' && + rightNode.type !== 'TemplateLiteral' ) { return } - /** @type {Expression | Super} */ - let rightId = rightNode + if (rightNode.type === 'TemplateLiteral') { + rightNode.expressions.some((expression) => + checkMemberAccess(expression, propsReferences, left, right) + ) + } else { + checkMemberAccess(rightNode, propsReferences, left, right) + } + } + + /** + * @param {Expression | Super} rightId + * @param {ScopePropsReferences} propsReferences + * @param {Pattern} left + * @param {Expression} right + * @return {boolean} + */ + function checkMemberAccess(rightId, propsReferences, left, right) { while (rightId.type === 'MemberExpression') { rightId = utils.skipChainExpression(rightId.object) } if (rightId.type === 'Identifier' && propsReferences.refs.has(rightId)) { report(left, 'getProperty', propsReferences.scopeName) + return true } if ( rightId.type === 'ConditionalExpression' && @@ -99,7 +116,9 @@ module.exports = { isPropsMemberAccessed(rightId.alternate, propsReferences)) ) { report(right, 'getProperty', propsReferences.scopeName) + return true } + return false } /** diff --git a/tests/lib/rules/no-setup-props-reactivity-loss.js b/tests/lib/rules/no-setup-props-reactivity-loss.js index 6321ea573..edf721d8d 100644 --- a/tests/lib/rules/no-setup-props-reactivity-loss.js +++ b/tests/lib/rules/no-setup-props-reactivity-loss.js @@ -144,6 +144,7 @@ tester.run('no-setup-props-reactivity-loss', rule, { const {x} = noProps ({y} = noProps) const z = noProps.z + const foo = \`\${noProp.foo}\` } } @@ -717,6 +718,43 @@ tester.run('no-setup-props-reactivity-loss', rule, { line: 4 } ] + }, + { + // https://github.com/vuejs/eslint-plugin-vue/issues/2470 + filename: 'test.vue', + code: ` + + `, + errors: [ + { + messageId: 'getProperty', + line: 5 + } + ] + }, + { + filename: 'test.vue', + code: ` + + `, + errors: [ + { + messageId: 'getProperty', + line: 5 + } + ] } ] })