How to set types to our props in vuejs

In Vue.js You can specify the type of a prop by using an object instead of an array, using the name of the property as the key of each property, and the type as the value:

Vue.component('user-name', {
  props: {
    firstName: String,
    lastName: String
  },
  template: '<p>Hi {{ firstName }} {{ lastName }}</p>'
})

The valid types you can use are:

• String
• Number
• Boolean
• Array
• Object
• Date
• Function
• Symbol

When a type mismatches, Vue alerts (in development mode) in the console with a warning.

Prop types can be more articulated.

You can allow multiple different value types:

props: {

  firstName: [String, Number]

}