iKMitt - 事件总线Mitt

mitt又称事务总线，是第三方插件。iKMitt是继承了mitt的所有功能。

相关教程

菜鸟教程：在Vue3+TypeScript前端项目中使用事件总线Mitt

vue3 兄弟组件通信—-mitt

导入方式

import { ikMitt } from 'iking-utils'

示例

<!-- home.vue -->
<template>
  <div class="home-container">
    <p>这里是home组件</p>
    <button @click="sendMitt">$mitt发送数据</button>
    <About></About>
  </div>
</template>
 
<script lang="ts" setup>
import { ikMitt } from 'iking-utils'
import About from '../about.vue'
 
const money = ref<number>(98);
 
const sendMitt = () => {
  ikMitt.emit('moneyEvent', money.value += 2)
}
</script>

<!-- about.vue -->
<script lang="ts" setup>
import { ikMitt } from 'iking-utils'
 
const amount = ref(0);
 
onMounted(() => {
  ikMitt.on('moneyEvent', (res: any) => {
    amount.value = res;
  });
})
 
onBeforeMount(() => {
  ikMitt.off('moneyEvent');
});
 
</script>

<style lang="less">
.about-container {
  background-color: #f0f0f0;
}
</style>