每到春天，红得如火的木棉花，粉得如霞的芍药花，白得如玉的月季花竞相开放。它们有的花蕾满枝，有的含苞初绽，有的昂首怒放。一阵沁人心肺的花香引来了许许多多的小蜜蜂，嗡嗡嗡地边歌边舞。
本文为大家分享了vuejs事件中心管理组件间的通信，供大家参考，具体内容如下
事件中心
这个可以是一个空的全局的Vue实例，其他的组件利用这个实例emit和on自定义事件，这样组件定义了自己的事件处理方法。
import Vue from 'Vue' window.eventHub = new Vue();
事件监听和注销监听
事件监听应在更组件的created钩子函数中进行，在组件销毁前应注销事件监听
//hook
created: function () {
//listen event
window.eventHub.$on('switchComments',this.switchComments);
window.eventHub.$on('removeIssue',this.removeIssue);
window.eventHub.$on('saveComment',this.saveComment);
window.eventHub.$on('removeComment',this.removeComment);
//get init data
var that =this;
axios.get('issue/index')
.then(function (resp) {
that.issue_list=resp.data;
});
},
beforeDestroy: function () {
window.eventHub.$off('switchComments');
window.eventHub.$off('removeIssue');
window.eventHub.$off('saveComment');
window.eventHub.$off('removeComment');
}
子组件的emit事件，注意这里用的window.$emit而不是this.emit
methods: {
removeComment: function(index,cindex) {
window.eventHub.$emit('removeComment', {index:index, cindex:cindex});
},
saveComment: function(index) {
window.eventHub.$emit('saveComment', {index: index, comment: this.comment});
this.comment="";
}
},
Note: 这其实还不是最理想的通信方式，下一篇我们看看vuex怎么玩
以上就是vuejavascript事件中心管理组件间的通信详解。交际的目的就是为了能与更多的人进行交往，能够更快地提升自己，能够获得别人更多的帮助。而要想让别人喜欢与你交往，就要树立自己的良好形象，用形象采打造出成功的交际。更多关于vuejavascript事件中心管理组件间的通信详解请关注haodaima.com其它相关文章！
