Property ‘proxy‘ does not exist on type ‘ComponentInternalInstance | null‘.ts

问题

Vue 3 使用 getCurrentInstance 获取当前正在执行的组件实例 TypeScript 报错。

typescript 复制代码
const { proxy } = getCurrentInstance();  

报错信息:

typescript 复制代码
Property 'proxy' does not exist on type 'ComponentInternalInstance | null'.ts

解决方案

在Vue 3的Composition API中,getCurrentInstance()返回的类型是ComponentInternalInstance | null。因此,当你使用const { proxy } = getCurrentInstance();时,TypeScript会报错,因为proxy属性在类型定义中并不存在。

为了解决这个问题,你可以使用类型断言(Type Assertion)来告诉TypeScript你确信返回的实例是非空的。在这种情况下,你可以使用非空断言!:

typescript 复制代码
const { proxy } = getCurrentInstance()!;

请注意,使用非空断言表示你确信getCurrentInstance()永远不会返回null。如果你不能确保这一点,最好在代码中进行适当的空值检查。例如:

typescript 复制代码
const instance = getCurrentInstance();

if (instance) {
  const { proxy } = instance;
  // 现在你可以安全地使用 proxy
} else {
  console.error("无法获取组件实例");
}
相关推荐
熊的猫4 分钟前
ES6 中 Map 和 Set
前端·javascript·vue.js·chrome·webpack·node.js·es6
布兰妮甜10 分钟前
前端框架大比拼:React.js, Vue.js 及 Angular 的优势与适用场景探讨
前端·vue.js·react.js·前端框架·angular.js
乆夨(jiuze)12 分钟前
vue2.7.14 + vant + vue cli脚手架转vite启动运行问题记录
前端·javascript·vue.js
梅子酱~14 分钟前
Vue 学习随笔系列十五 -- 数组遍历方法
javascript·vue.js·学习
niech_cn40 分钟前
项目启动运行npm run dev报错digital envelope routines::unsupported at new Hash
前端·npm·哈希算法
shchojj43 分钟前
cuda的3DArray和TextureObject
前端
OpenTiny社区1 小时前
重磅更新!Fluent Editor 开源富文本支持 LaTeX 可编辑公式啦~
前端·ui·开源·opentiny
豆豆1 小时前
如何选择企业网站模版来搭建网站?
服务器·开发语言·前端·php·软件构建
小白菜学前端1 小时前
Threejs 材质贴图、光照和投影详解
前端·3d·three.js
浮华似水1 小时前
Docker入门系列——Docker-Compose
前端