实践中大部分Provide/Inject使用场景,是要注入一些定义在组件中的方法。此时如何给注入项标注TS类型成了难题。我们可以直接通过as直接手动标注,但是如果原注入项类型如果变动,手动标注维护将相当麻烦。
我的思路是利用InstanceType<>这个工具,首先将原注入项openBlindBoxSetting项导出
function openBlindBoxSetting(schemeId:string){
myBlindBoxSetting.value?.showModal(schemeId)
}
provide("openBlindBoxSetting",openBlindBoxSetting)
//前加_以标识为仅为type目的
defineExpose({_openBlindBoxSetting:openBlindBoxSetting})
在被注入的地方
import PropManagerOnline from "../../../views/PropManagerOnline.vue";
type a=InstanceType<typeof PropManagerOnline>
const openBlindBoxSetting=inject("openBlindBoxSetting") as a['_openBlindBoxSetting']
这样就可以拿到原注入项的代码类型提示了