一.、父传子
父组件引入子组件
子组件 在 props 定义需要接收的数据
二、子传父
父组件引入子组件
子组件 this.emit('事件',console.log(传递的数据))
三、非父子组件通信
eventBus
1、 新建 bus.js
import Vue from 'vue';
export default new vue()
要通信的组件引入
import bus from './bus.js'
在组件中传递
bus.$emit('event',value)
在组件中接收
bus.$emit('event',value)
2、使用 provide/inject
tab > tab-head - tabs-item
根组件中
data(){
return {
eventBus:new Vue()
}
},
provide(){
return {
eventBus: this.eventBus
}
}
子孙组件中
inject: ['eventBus']
使用 eventBus
在组件中传递
eventBus.$emit('event',value)
在组件中接收
eventBus.$emit('event',value)
网友评论