标签:表达 显示 style com ber html 数字 cti ret
父组件传参到子组件,子组件可以对他进行约束,string、number等
没有冒号表示字符串
<child content="123" ></child>
有冒号表示数数字,
加了冒号这是js表达式
<child :content="123" ></child>
这一种没有约束
Vue.component(‘child‘,{
props:[‘content‘],
template:`<div>{{content}}</div>`
}
约束是字符串或是数字
Vue.component(‘child‘,{
props:{
//即可以是数字有可以是字符串
content:[Number,String,]
},
template:`<div>{{content}}</div>`
})
约束是对象
Vue.component(‘child‘,{
props:{
content:{
type:String,
//是否为必须传入
required:false,
//如果没有content传入,就显示这个
default:‘default value‘,
}
},
template:`<div>{{content}}</div>`
})
自定义约束
Vue.component(‘child‘,{
props:{
//是对象
content:{
type:String,
//是否为必须传入
required:false,
//如果没有content传入,就显示这个
default:‘default value‘,
//自定义校验器
validator:function(value){
return(value.length > 5)
}
},
}
template:`<div>{{content}}</div>`
})
标签:表达 显示 style com ber html 数字 cti ret
原文地址:https://www.cnblogs.com/yubaibai/p/10701148.html