vue 实现跨组件调用与传值

150 阅读1分钟

1.通过递归遍历方式进行 on() 注册 与 .emit()执行

//注册全局方法 
1. 从子往上传递
Vue.prototype.$dispatch = function(eventName,data) { 
  this.$emit(eventName,data);
  let parent = this.$parent; 
  while (parent) {
    parent.$emit(eventName,data);
     parent = parent.$parent;
  }
}
2. 从父往子传递
Vue.prototype.$boardcast = function(eventName,data) {
  boardcast.call(this,eventName,data);
}
function boardcast(eventName,data) {  
  this.$emit(eventName,data);
  this.$children.forEach(children => {
    children.$emit(eventName,data);
    if(children.$children.length > 0){
      boardcast.call(children,eventName,data);
    } 
  });
}