组件通讯
父传子
通过在标签绑定数据
props:['mag']
子传递父
//子:定义一个自定义事件
this.$emit(‘created’,val)
//caeated 自定义事件的名字 val你要携带的数据
//父:接收使用自定义事件
methods:{
changeVal(val){//然后data里面定义
this.value = val;
}
}
总结
父组件向子组件传递数据是通过props
子组件向父组件传递数据是通过事件
中央通讯
定义一个空的vue对象
const centre = new Vue()
Vue.component('Aaa',{
template:'
我是aaaaaaa
',//点击A的时候methods:{
aaa(){
sub.$emit('is-aaaa');//发送一个is-aaaa函数 然后一直冒泡 直到找到$on
}
}
});
Vue.component('Bbb',{
props:['mag'],
template:`
{{mag}}
`,created() {
sub.$on('is-aaaa',()=> {//接收 然后执行 什么
this.mag = '我是改变后的'
})
}
});
网友评论