关于兄弟组件之间的传值,我这里是通过vue-bus实现的
安装vue-bus
npm install vue-bus
在入口文件(main.js)进行全局注册
import VueBus from 'vue-bus'
Vue.use(VueBus)
传递数据
- 定义一个触发事件(allLink),传递参数
“/link”
allLink () {
this.$bus.emit('link', '/link')
}
接收数据
- 在created方法中使用
this.$bus.on
监听allLink并传入回调函数this.link,该回调函数的参数就是传递过来的数据
created () {
this.$bus.on('link', this.link)
},
link (link) {
this.activeIndex = link
console.log(link)
}
销毁监听事件
- 离开该页面时就无需再监听了,所以要销毁该监听事件,this.$bus.off就是销毁该监听事件
beforeDestroy () {
this.$bus.off('link', this.link)
},