欢迎访问 生活随笔!

尊龙游戏旗舰厅官网

当前位置: 尊龙游戏旗舰厅官网 > 前端技术 > vue >内容正文

vue

combus通讯-尊龙游戏旗舰厅官网

发布时间:2024/10/8 vue 0 豆豆
尊龙游戏旗舰厅官网 收集整理的这篇文章主要介绍了 combus通讯_vue兄弟组件通信bus传值--小案例 小编觉得挺不错的,现在分享给大家,帮大家做个参考.

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-组件通讯

总结

以上是尊龙游戏旗舰厅官网为你收集整理的combus通讯_vue兄弟组件通信bus传值--小案例的全部内容,希望文章能够帮你解决所遇到的问题。

如果觉得尊龙游戏旗舰厅官网网站内容还不错,欢迎将尊龙游戏旗舰厅官网推荐给好友。

  • 上一篇:
  • 下一篇:
网站地图