vue prop传值类型检验

prop 传值检验规则

• 如果是 prop 是静态传值，则必须是 String 类型
• 如果是 prop 是动态传值，则可以验证任意类型
• 示例，如果必须要传一个Number，就必须使用 bind

//声明
Vue.component("blog-post", {
  props: {
    postTitle: {
      type: Number,
      default: 10000
    }
  },
  template: "<h3>{{ postTitle }}</h3>"
});
//在template中调用，静态传值，值必定是 String
<blog-post postTitle="54"></blog-post>
//在template中调用，动态传值，值可以是 String、Number、Boolen。。。
<blog-post :postTitle="54"></blog-post>

类型检查的 type 值，可以是下列原生构造函数中的一个：

• String
• Number
• Boolean
• Array
• Object
• Date
• Function
• Symbol
• type 还可以是一个自定义的构造函数，并且通过 instanceof 来进行检查确认。示例：

//例如，给定下列现成的构造函数：
function Person (firstName, lastName) {
  this.firstName = firstName
  this.lastName = lastName
}
//可以使用,检验是否为 Person 的实例
Vue.component('blog-post', {
  props: {
    author: Person
  }
})