起因
看到标题的vue2和script setup放在一起是不是有点懵?没错,我也是!
今天在做需求时需要用到EventBus,但是EventBus在vue3中被移除掉了,由于是新接触的项目,写的时候看用的是script setup,理所当然地认为是vue3,于是各种寻找资料找解决方式,想通过引入mitt来解决。
结果在main里一看,怎么createApp引不进来?再一看,用的是new Vue,难道这项目是vue2!!?于是在命令行输入
npm list vue
好家伙,竟然用的是vue@2.7.14
那就按vue2的方式来处理好了
解决方法
在main.ts中注册一个EventBus
Vue.prototype.$EventBus = new Vue()
问题来了,script setup里似乎没有this,也就没法用this.$EventBus来使用了
最后灵光一现,用了以下方法,在要使用的组件中:
import {getCurrentInstance} from 'vue'
<script setup>
const {proxy} : any = getCurrentInstance()
onMounted(()=>{
proxy.$EventBus.$emit('msg','msg')
})
</script>
即可。