vue2全局事件总线

main.js

new Vue({
  router,
  store,
  render: (h) => h(App),
  beforeCreate() {
    Vue.prototype.$bus = this
  }
}).$mount('#app')

<template>
  <div @click="chuandi">我是组件A,点击传递数据给组件B：{{ count }}</div>
</template>

<script>
export default {
  data() {
    return {
      count: 0
    }
  },
  methods: {
    chuandi() {
      this.$bus.$emit('getValue', this.count)
    }
  }
}
</script>

<style></style>

<template>
  <div>我是组件B,我接收到组件A传递到的数据：{{ value }}</div>
</template>

<script>
export default {
  data() {
    return {
      value: ''
    }
  },
  mounted() {
    this.$bus.$on('getValue', (value) => {
      this.value = value
    })
  },
  beforeDestroy() {
    this.$bus.$on('getValue')
  }
}
</script>

<style></style>