解决vue3模板中ts类型检查异常

您所在的位置:网站首页 vscode使用vue的v-for报错 解决vue3模板中ts类型检查异常

解决vue3模板中ts类型检查异常

2023-07-31 23:29| 来源: 网络整理| 查看: 265

在script中类型已经明明白白的推断出来了,到了template中v-for循环数组array,竟然连item类型都推断不出来??大坑!

我的问题是这样的:

const options = [ { value: "Option1", label: "Option1", }, { value: "Option2", label: "Option2", }, ]; defineExpose({ options }); 复制代码

大体删减了一些无用代码,预期应像 Element Plus 上的效果一致

实际效果是达到了,但是 typescript 这边报错了

4c900f3773984f275ff0cb5c052d52c1-16476057137591.png

4e052c41ff6baa0ffb07ceee9682823e-16476057241272.png

fd3a1b4d1ae5249115e615d6f64f8f72-16476057344133.png

typescript 说我的 item 是 unknown 类型,有脚指头都能算出来数组里面的类型应该是:

type item = { value: string; label: string; }; 复制代码

然后找到解决方案是

给 tsconfig.json 添加如下:

{ "compilerOptions": { ... "target": "es5", "lib": ["dom","es5","ES2015.Promise","ES2015","es2017"], }, ... } 复制代码

问题成功解决:

image-20220318201945232-16476059875724.png 思路最早是看这篇文档:

vue3+ts使用v-for出现unknown问题-CFANZ编程社区

但是照他的做法,没解决,反而其他类型都乱了,最终自己琢磨的

另外作者分析是 API 版本太低,从 ES5 改成 ES2015,实际上我是改成 ES5 解决的,可能原因不是版本太低,还需要继续研究是什么原因。



【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3