1.使用事件总线机制
- 1.创建实例,导出实例,新建bus.js文件
import Vue from "vue"
const Bus = new Vue()
export default Bus
- 2.传值的组件引入事件总线实例,发射事件
import Bus from 'bus.js'
Bus.$emit('something','我是传递的值')
- 3.接收的组件引入事件总线实例,接收事件
import Bus from 'bus.js'
Bus.$on('something',(res) => {
console.log(res) // ==> '我是传递的值'
})
2.使用provide/inject
- 1.要传值的组件provide
provide:{
something:'我是传递的值'
}
如果要传递的时data里的值,要使用函数的形式return(同data)
data(){
return{
msg:'我是传递的值'
}
},
provide(){
return{
something: this.msg
}
}
- 2.接收值的组件通过inject接收
inject:{
message:{
from: 'something'
}
},
mounted(){
console.log(this.message) // ==> '我是传递的值'
}
- 3.使用vuex,就不多介绍了