Property should be unique between Vue options
- VUE_DUPLICATE_PROPERTY_IN_OPTION
- Error
- Medium
- vue
This rule applies when multiple properties with the same name are defined between Vue options.
If duplicate property names are declared between the following Vue options, only one of them is used:
props
computed
data
methods
Duplicate properties can lead to unintended behavior because the values specified at others are ignored. Also Vue outputs a warning message.
Noncompliant Code Example
View with compliant examples side by sideimport Vue from 'vue';
new Vue({
el: '#app',
data: {
foo: 'hi',
myName: 'Mike'
},
computed: {
foo() { // VUE_DUPLICATE_PROPERTY_IN_OPTION alarm because 'foo' is already defined in 'data' option.
return this.myName + ' hi';
}
},
template: '<div>{{ foo }}</div>'
});
Compliant Code Example
View with noncompliant examples side by sideimport Vue from 'vue';
new Vue({
el: '#app',
data: {
myName: 'Mike'
},
computed: {
foo() {
return this.myName + ' hi';
}
},
template: '<div>{{ foo }}</div>'
});
Version
This rule was introduced in DeepScan 1.15.0-beta.
See
[Vue warn]: The computed property
foo
is already defined in data.[Vue warn]: The data property
foo
is already declared as a prop. Use prop default value instead.[Vue warn]: Method
foo
has already been defined as a data property.[Vue warn]: Method
foo
has already been defined as a prop.