本篇文章主要介绍了vue中component组件的props使用详解,这里整理了详细的用法,具有一定的参考价值,有兴趣的可以了解一下
本文介绍了 vue中component组件的props使用详解,分享给大家,具体如下:
props使用方法
Vue.component('my-component',{ props:['message'], template:'<div class="tem1">{{message}}</div>' });
注意:props 的声明需要放在template的前面
props可以使用实例中的变量赋值
全局组件可以获取用使用prop 的做操作
下面例子为message先先渲染为 “hello!!!” click点击事件 调用zan方法为重新为comdata,message赋值
但是只有comdata显示 不能影响message的值显示
<div id="app"> </div>
prop验证
组件为props提供了验证功能本文来源gaodai$ma#com搞$代*码6网
props:{propName: { typpe:[Number,String,Boolean,Function,Array,Object], default:function(){ return {name:'weng'} }, validator:function(value){ return value.length>3 } } }
ps:type可以自定义 使用instanceof检测
validator验证需要在开发版本vuejs下在控制台才会有输出
以上就是vue中component组件的props使用详解的详细内容,更多请关注gaodaima搞代码网其它相关文章!