一、安装插件
npm install mitt
二、引入(main.js)
import mitt from "mitt"
import {createApp} from "vue"
const app = createApp({})
//挂载全局API
app.config.globalProperties.$bus = new mitt()
三、使用
<script setup>
//获取当前组件实例
const { proxy } = getCurrentInstance();
//绑定事件
proxy.$bus.on("appLoading", (res) => {
console.log('动作执行')
});
</script>
<script setup>
//获取当前组件实例
const { proxy } = getCurrentInstance();
//触发事件
proxy.$bus.emit("appLoading", true);
</script>
本文介绍如何在Vue项目中利用Mitt轻量级事件库来实现组件间的事件通信。首先通过npm安装Mitt插件,接着在main.js文件中引入并挂载到Vue实例上作为全局API,最后在组件内通过获取当前实例的方式调用$bus来绑定和触发事件。
723

被折叠的 条评论
为什么被折叠?



