Prop验证,有利于维护以及 开发人员看到
Vue.component('my-component', {
props: {
// 必填的字符串
propC: {
type:[String, Number],
default: 100
required: true
},
// 带有默认值的对象
propE: {
type: Object,
// 对象或数组默认值必须 return一个函数
default: function () {
return { message: 'hello' }
}
},
// 自定义验证函数
propF: {
validator: function (value) {
// 这个值必须匹配下列字符串中的一个
return ['success', 'warning', 'danger'].indexOf(value) !== -1
}
}
}
})
// 当 prop 验证失败的时候,(开发环境构建版本的) Vue 将会产生一个控制台的警告。
// 注意那些 prop 会在一个组件实例创建之前进行验证,所以实例的 property (如 data、computed 等) 在 default 或 validator 函数中是不可用的。
//简单写法
props: ['size'],