require-valid-default-prop.md

enforce props default values to be valid (vue/require-valid-default-prop)

• ⚙️ This rule is included in all of "plugin:vue/essential", "plugin:vue/strongly-recommended" and "plugin:vue/recommended".

This rule checks whether the default value of each prop is valid for the given type. It should report an error when default value for type Array or Object is not returned using function.

📖 Rule Details

👎 Examples of incorrect code for this rule:

props: {
  propA: {
    type: String,
    default: {}
  },
  propB: {
    type: String,
    default: []
  },
  propC: {
    type: Object,
    default: []
  },
  propD: {
    type: Array,
    default: []
  },
  propE: {
    type: Object,
    default: { message: 'hello' }
  }
}

👍 Examples of correct code for this rule:

props: {
  // basic type check (`null` means accept any type)
  propA: Number,
  // multiple possible types
  propB: [String, Number],
  // a number with default value
  propD: {
    type: Number,
    default: 100
  },
  // object/array defaults should be returned from a factory function
  propE: {
    type: Object,
    default() {
      return { message: 'hello' }
    }
  },
  propF: {
    type: Array,
    default() {
      return []
    }
  }  
}

🔧 Options

Nothing.

Related links

• Guide - Prop Validation