vue 多级组件传参数

1. 在main.js 中写入
/**
 * 
 *    针对父子组件向上通知
 *    子组件
 *    this.$dispatch('方法', 参数)
 *    父组件 
 *    this.$on('方法', (val) => {})
 */
Vue.prototype.$dispatch = function(eventName, value) {
  let parent = this.$parent;
  while (parent) {
      parent.$emit(eventName, value);
      parent = parent.$parent;
  }
};


/**
 * 
 *    针对父子组件向下通知
 *    父组件
 *    this.$broadcast('方法', 参数)
 *    子组件
 *    this.$on('方法', (val) => {})
 */
Vue.prototype.$broadcast = function(eventName, value) {
  const broadcast = children => {
      children.forEach(child => {
          child.$emit(eventName, value);
          if (child.$children) {
              broadcast(child.$children)
          }
      });
  }
  broadcast(this.$children);
};
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容