其实原理蛮简单的,整个过程就需要三步
- 在main.js的同级目录下创建一个新的vue文件,并给它创建一个新的vue实例
import Vue from 'vue'
export default new Vue()
- 给传出数值的A组件使用$emit
<template>
<div @click="onfocus"></div>
</template>
<script>
import New from '@/new.js'
export default{
methods:{
onfocus:function(fromid){
New.$emit('getisshow',{
show:true
})
}
}
}
</script>
- 在同级B组件中用$on接收
<script>
import New from '@/new.js'
export default{
created(){
New.$on('getisshow',data => {
console.log(data) //{show:true}
})
}
}
</script>