使用该工具进行组件间通信的一个优点是组件可以隔代通信,不必像使用v-bind数据绑定一样,需要用prop逐层传递
这里简略介绍基本使用方法
// 子组件发布消息
/* Todo.vue */
methods : {
delete_data(){ // 子组件私有函数
if(window.confirm(`确认要删除吗`)){
/* 发布消息 */
PubSub.publish("delete_data", comment) // 参数一:消息名;参数二:需要传递的参数数据
}
}
// 爷组件订阅消息
/* App.vue */
mounted() { //挂载后就订阅
/* 订阅消息 */
PubSub.subscribe('delete_data' , (msg , comment)=>{ // 参数一msg:暂时无关紧要,但是必须写;参数二:对应传递的数据
this.delete_data(comment) // 调用此组件里的函数
// this.comments_data = this.comments_data.filter(item => item!=comment)
})
}
/**
*孙组件如果调用了含有发布消息的函数,订阅消息里的操作便会被触发,同时也会伴随组件数据以函数参数进行传递
*
**/