combus通讯-凯发k8官方网

1、首先定义一个bus.js文件

引入空的vue，实例化，曝光出去

import vue from 'vue'

const bus = new vue({})

export default bus

2、创建两个vue文件(兄弟组件)

值得注意的监听派发事件之后，要用es6的箭头函数

a组件

a组件:{{msg}}

a组件

//引入bus文件

import bus from './bus.js'

export default {

data(){

return {

msg:'taylorswift'

}

},

methods:{

brother(){

// 派发事件

bus.$emit('a',this.msg)

}

}

}

b组件

b组件:{{msg}}

//引入bus文件

import bus from './bus.js'

export default{

data(){

return{

msg:"goddess"

}

},

created(){

// 监听派发的事件

bus.$on('a',(res)=>{

console.log(res)

this.msg = res

})

}

}

如有不懂，可以看我的 vue-组件通讯

总结

以上是凯发k8官方网为你收集整理的combus通讯_vue兄弟组件通信bus传值--小案例的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得凯发k8官方网网站内容还不错，欢迎将凯发k8官方网推荐给好友。