因为 vue 的 reactive 对象会自动对 ref 对象进行解包,所以导致了 ts 报错,有什么解决方法吗?-灵析社区

疯狂的搬运工

* 当 ref 对象作为 reactive 对象的属性,在定义 reactive 对象获取其类型时或读取 reactive 对象的 ref 属性时都会对 ref 对象进行自动的解包,因此就出现了以下的 ts 报错 * 实际上下面的两个报错都是符合 vue 的特性的,并没有问题 * 有没有什么办法可以让这两种情况可以正确的识别类型,或者说可以让这两种情况不报错(之前一种用 as any 和 as unknown as xxx 来解决,感觉是在是太丑陋了) import type { Ref } from 'vue' import {ref, reactive} from 'vue' interface IObj { count: Ref | null; arr: { // 如果是这种自定义属性的对象类型则不会在 reactive 返回值的类型中进行解包 [key:string]: Ref } | null; o?: { oo: Ref } } const obj = reactive({ count: null, arr: null }) /* reactive 返回值的类型 const obj: { count: number | null; arr: { [key: string]: Ref; } | null; o?: { oo: number; } | undefined; } */ // 这里ts报错: 不能将类型“Ref”分配给类型“number” obj.count = ref(1) obj.arr = { aa: ref(0), bb: ref(1) } // 这里ts报错: 不能将类型“Ref”分配给类型“number” let num:number = obj.arr.aa console.log(num); // 0

阅读量:23

点赞量:0

问AI
目前没什么好的方式, 你可以追踪下这两个issue: "https://github.com/vuejs/core/issues/3478" (https://link.segmentfault.com/?enc=haNZ1J84ULgE6yq1PIRv4Q%3D%3D.PrI%2B8JhSr2B9im9%2B%2BH%2F1mtAq5ePl%2Bia9UKCtdZe3yV%2FWDuvyUzXE0oFnB7mGBKwt) "https://github.com/microsoft/TypeScript/issues/43826" (https://link.segmentfault.com/?enc=oVynbBBgK3D2yrREblbG3g%3D%3D.zGE1I3U3sqsTZWxtbljoVcR31AOUvg992Kof0fe8i7E6iKFAoBOFC5sE3%2FdTNXaKkj8KbbGOiD4xY4Bpvqvp5w%3D%3D)