标签:生效 for 传递 ali font node 局部变量 ext func
props down, events up
父组件通过 props 向下传递数据给子组件;子组件通过 events 给父组件发送消息。
静态 props
要让子组件使用父组件的数据,需要通过子组件的 props 选项。给 childNode 添加一个 props 选项和需要的forChildMsg数据;
var childNode = { template: ` <div> {{forChildMsg}} </div> `, props: ["for-child-msg"]};动态 props
在模板中,要动态地绑定父组件的数据到子组件模板的 props,和绑定 Html 标签特性一样,在父组件的template模板里使用v-bind绑定;
<child :for-child-msg="childMsg2"></child>props 验证Vue.component("example", { props: { // 基础类型检测, null意味着任何类型都行 propA: Number, // 多种类型 propB: [String, Number],还可以在 props 定义的数据中加入自定义验证函数,当函数返回 false 时,输出警告。该函数命名是规定叫validator,自定义函数名不会生效。
props: { "for-child-msg": { validator: function(value) { return value > 100; } }} data() { return { ownChildMsg: this.forChildMsg }; }, watch: { forChildMsg() { this.ownChildMsg = this.forChildMsg; } }type="text" 就会替换掉 type="date" 并把它破坏!庆幸的是,class 和 style 特性会稍微智能一些,即两边的值会被合并起来,从而得到最终的值。如果你不希望组件的根元素继承特性,你可以在组件的选项中设置 inheritAttrs: false。标签:生效 for 传递 ali font node 局部变量 ext func
原文地址:https://www.cnblogs.com/icctuan/p/12085139.html