vue3项目中，如果不用ts这样使用是没问题的
const { proxy } = getCurrentInstance()在ts中使用会报错：报错：...类型“ComponentInternalInstance | null”
我们在项目中一般会用到很多getCurrentInstance()方法，直接封装一下
创建useCurrentInstance.ts文件：
import { ComponentInternalInstance, getCurrentInstance } from 'vue'
export default function useCurrentInstance() {
const { appContext } = getCurrentInstance() as ComponentInternalInstance
const proxy = appContext.config.globalProperties
return {
proxy
}
}组件内使用：
立即学习“前端免费学习笔记（深入）”；
<script lang="ts">
import { defineComponent } from "vue";
import useCurrentInstance from "@/utils/useCurrentInstance";
export default defineComponent({
setup() {
const { proxy } = useCurrentInstance();
console.log(proxy);
},
});
</script>vue3中没有this + 各种api的方法
vue3提供的方法，创建类似于this的实例。
const instance = getCurrentInstance()
const a1= getCurrentInstance();
a1.$toast({type: 'error', text: '登录失败' });这种只适合本地调试，运行到线上就会报错，报错详情为：
类型“ComponentInternalInstance | null”上不存在属性“proxy”。ts(2339)
然后下面会报这个错误
Unsafe member access .$axios on an `any` value. eslint@typescript-eslint/no-unsafe-member-accessUnsafe call of an `any` typed value. eslint@typescript-eslint/no-unsafe-call
原因：
getCurrentInstance()的返回类型存在null所以在此处添加断言即可。
在proxy后面添加?来过滤null的结果，即：
const instance = getCurrentInstance()?.proxy
instance ?.$toast('请xxx！')以上就是Vue3之getCurrentInstance与ts怎么结合使用的详细内容，更多请关注php中文网其它相关文章！
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。
广告
收藏
收藏
收藏
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
336
