eventBus和watch执行先后顺序 vue

eventBus和watch执行先后顺序

在项目中遇到eventBus.$on的执行事件影响到了watch的监听，因此做这个笔记来记录一下遇到的问题。

1. 发生次问题的前提条件是vue+element-ui，父组件点击一个按钮显示子组件弹出框，父组件引入子组件，子组件中是弹框el-dialog，子组件初始是display： none，隐藏子组件，在加载父组件的时候同时将子组件初始化
2. 通过父组件点击一个按钮触发事件eventBus.$emit（‘update’），在子组件的mounted钩子函数中执行eventBus.$on(‘update’)事件。

watch: {
//showAdd控制弹框的显示和隐藏
      showAdd(n) {
          if(n === true) {
              console.log('监听事件')
          }
      }
  },

  mounted() {
    this.$EventBus.$on("update", row => {
        console.log('eventBus.$on事件')
    });
  },

输出结果：