# vue/no-template-shadow
disallow variable declarations from shadowing variables declared in the outer scope
- ⚙️ This rule is included in all of
"plugin:vue/vue3-strongly-recommended","plugin:vue/strongly-recommended","plugin:vue/vue3-recommended"and"plugin:vue/recommended".
no-template-shadow should report variable definitions of v-for directives or scope attributes if those shadows the variables in parent scopes.
# 📖 Rule Details
This rule aims to eliminate shadowed variable declarations of v-for directives or scope attributes.
<template>
<!-- ✓ GOOD -->
<div v-for="i in 5"></div>
<div v-for="j in 5"></div>
<!-- ✗ BAD -->
<div>
<div v-for="k in 5">
<div v-for="k in 10"></div>
<div slot-scope="{ k }"></div>
</div>
</div>
<div v-for="l in 5"></div>
</template>
<script>
export default {
data () {
return {
l: false
}
}
}
</script>
# 🔧 Options
Nothing.
# 🚀 Version
This rule was introduced in eslint-plugin-vue v5.0.0