vue.js的非父子组件通信,利用空Vue做中央事件总线。能举个例子吗,不是很懂官网上的例子。

// 在组件 B 创建的钩子中监听事件
bus.$on('id-selected', function (id) {
  // ...
})

这一段不是很懂,是指下面的意思吗

Vue.component('B', {
     methods: {
        listen: function() {
            bus.$on('id-selected', function (id) {
              // ...
            })
        }
    }
})

回答:

参考 http://runjs.cn/code/k0nfythj

回答:

<div id="app">
    <c1></c1>
    <c2></c2>
</div>
var Bus = new Vue();
Vue.component('c1',{
  template:'<div>{{msg}}</div>',
  data: () => ({
    msg: 'Hello World!'
  }),
  created() {
    Bus.$on('setMsg', content => {
      this.msg = content;
    });
  }
});
Vue.component('c2',{
  template: '<button @click="sendEvent">Say Hi</button>',
  methods: {
    sendEvent() {
      Bus.$emit('setMsg', 'Hi Vue!');
    }
  }
});
var app= new Vue({
    el:'#app'
})

回答:

关于如何引入eventBus这个事件总线

http://blog.csdn.net/sinat_17…
这篇文章讲的很详细

回答:

Vue.js——60分钟组件快速入门http://www.cnblogs.com/keepfool/p/5637834.html

暂无评论

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注