vue3中使用 mitt 遇到问题

Question

main.ts 中：

import mitt from "mitt"

const Mit = mitt()

declare module "vue" {
    export interface ComponentCustomProperties {
        $Bus: typeof Mit 
    }
}

const app = createApp(App)
app.config.globalProperties.$Bus = Mit

页面中监听事件时报错：

import { getCurrentInstance, onUnmounted } from 'vue'
const instance = getCurrentInstance() // 获取组件实例

const callback = (val: string) => {
    return console.log('接收到的数据val: ', val);
}
instance?.proxy?.$Bus.on("on-click2", callback) // 注册事件监听

onUnmounted(() => {
    instance?.proxy?.$Bus.off("on-click2", callback) // 删除事件监听
})

报错：

没有与此调用匹配的重载。
  第 1 个重载(共 2 个)，“(type: "*", handler: WildcardHandler<Record<EventType, unknown>>): void | undefined”，出现以下错误。
  第 2 个重载(共 2 个)，“(type: "on-click2", handler: Handler<unknown>): void | undefined”，出现以下错误。ts(2769)

Answer 1

终于解决了，原来是需要给 callback 标注类型：

type handler = Handler<any>
const callback: handler = (val: string) => {}