码迷,mamicode.com
首页 > 其他好文 > 详细

事件总线bus解决兄弟组件之间的传值

时间:2019-08-25 20:30:38      阅读:70      评论:0      收藏:0      [点我收藏+]

标签:key   link   keyword   ring   table   ade   code   efault   tps   

原文引用https://www.dazhuanlan.com/2019/08/25/5d625951eff92/


事件总线bus解决兄弟组件之间的传值

实际运用:

封装一个Bus.js

1
2
3
import Vue from ‘vue‘
const Bus = new Vue()
export default Bus

在组件调用时引入

组件一:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
import Bus from ‘./Bus‘

export default {
data() {
return {
.........
}
},
methods: {
....
Bus.$emit(‘log‘, 120)
},

}

组件二:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
import Bus from ‘./Bus‘

export default {
data() {
return {
.........
}
},
mounted () {
Bus.$on(‘log‘, content => {
console.log(content)
});
}
}

事件总线bus解决兄弟组件之间的传值

标签:key   link   keyword   ring   table   ade   code   efault   tps   

原文地址:https://www.cnblogs.com/petewell/p/11408835.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有 京ICP备13008772号-2
迷上了代码!