no-unused-properties.md

pageClass	sidebarDepth	title	description
rule-details	0	vue/no-unused-properties	disallow unused properties

vue/no-unused-properties

disallow unused properties

📖 Rule Details

This rule is aimed at eliminating unused properties.

::: warning Note This rule cannot be checked for use in other components (e.g. mixins, Property access via $refs) and use in places where the scope cannot be determined. :::

<!-- ✓ GOOD -->
<template>
  <div>{{ count }}</div>
</template>
<script>
  export default {
    props: ['count']
  }
</script>

<!-- ✗ BAD (`count` property not used) -->
<template>
  <div>{{ cnt }}</div>
</template>
<script>
  export default {
    props: ['count']
  }
</script>

🔧 Options

{
  "vue/no-unused-properties": ["error", {
    "groups": ["props"]
  }]
}

• "groups" (string[]) Array of groups to search for properties. Default is ["props"]. The value of the array is some of the following strings:
  • "props"
  • "data"
  • "computed"
  • "methods"
  • "setup"

"groups": ["props", "data"]

<!-- ✓ GOOD -->
<script>
  export default {
    data() {
      return {
        count: null
      }
    },
    created() {
      this.count = 2
    }
  }
</script>

<!-- ✗ BAD (`count` data not used) -->
<script>
  export default {
    data() {
      return {
        count: null
      }
    },
    created() {
      this.cnt = 2
    }
  }
</script>

"groups": ["props", "computed"]

<!-- ✓ GOOD -->
<template>
  <p>{{ reversedMessage }}</p>
</template>
<script>
  export default {
    data() {
      return {
        message: 'Hello'
      }
    },
    computed: {
      reversedMessage() {
        return this.message.split('').reverse().join('')
      }
    }
  }
</script>

<!-- ✗ BAD (`reversedMessage` computed property not used) -->
<template>
  <p>{{ message }}</p>
</template>
<script>
  export default {
    data() {
      return {
        message: 'Hello'
      }
    },
    computed: {
      reversedMessage() {
        return this.message.split('').reverse().join('')
      }
    }
  }
</script>

🔍 Implementation

• Rule source
• Test source