eventbus一般是用来兄弟组件之间的通信,但是在vue-router中也可以用来做不同页面之间事件的传递。

上面是一个小demo,里面有两个页面,child和child1,child1页面中有一个num,初始值为1,然后通过eventbus定义了一个add和sub事件,child页面通过用$emit触发child1中的事件,达到让child1页面中num增加或减少的目的。

注意child页面中触发和跳转的写法:

这里是先进行页面跳转,跳转后,新的页面将会初始化,在新的页面进行mounted之前,会去销毁旧的页面,因此,child1页面上的事件绑定要写在created中,不能写在mounted中。

注意child中的$emit是写在$nextTick中的,因为页面跳转后,child1初始化,走到了created(),定义事件,然后销毁child页面,最后执行$emit触发事件。顺序一旦搞错了,就会导致无法触发。

其他文章

0
我要评论

评论

返回
×

我要评论

回复:

昵称:(昵称不超过20个字)

图片:

提交
还可以输入500个字