Uninitialized properties of a Vue instance should not be accessed

• VUE_UNINITIALIZED_INSTANCE_PROPERTY
• Error
• Medium
• vue

This rule applies when the uninitialized properties of a Vue instance are accessed.

In Vue's certain lifecycle methods, some properties are not yet initialized as follows:

1. beforeCreate(): $data, $props, $el properties
2. created(): $el property

Accessing uninitialized properties in the above lifecycle methods causes a TypeError exception or leads to an undefined behavior.

Noncompliant Code Example

<script>
export default {
  data() {
    return { msg: 'hi' };
  },
  beforeCreate() {
    // VUE_UNINITIALIZED_INSTANCE_PROPERTY alarm because 'this.$data' property has not yet been initialized in 'beforeCreate()'.
    // A TypeError occurs because 'this.$data' is 'undefined'.
    if (this.$data.msg === 'hi') {
      // do something
    }
  }
}
</script>

Compliant Code Example

<script>
export default {
  data() {
    return { msg: 'hi' };
  },
  created() {
    if (this.$data.msg === 'hi') {
      // do something
    }
  }
}
</script>

Version

This rule was introduced in DeepScan 1.15.0-beta.

See

• beforeCreate() lifecycle method

• created() lifecycle method

• [Vue warn]: Error in beforeCreate hook: TypeError: this.$data is undefined