TS检查类型报错“元素隐式具有 “any“ 类型，因为类型为 “string“ 的表达式不能用于索引类型”

最新推荐文章于 2024-02-26 11:41:15 发布

白白布凯西

最新推荐文章于 2024-02-26 11:41:15 发布

阅读量1.8k

点赞数

文章标签：开发语言 ecmascript typescript

本文链接：https://blog.youkuaiyun.com/byebukesi/article/details/132693628

版权

博客围绕TS检查类型报错‘元素隐式具有 “any” 类型，因为类型为 “string” 的表达式不能用于索引类型’展开。定位问题是因动态索引使用string类型且文件未预设索引类型。解释了JS弱类型与TS强类型的区别，给出解决办法，即显式声明类型，后续还将介绍本地svg图库封装。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

TS检查类型报错“元素隐式具有 “any” 类型，因为类型为 “string” 的表达式不能用于索引类型”

在这里插入图片描述

在这里插入图片描述
src/assets/icons/icons.ts中的内容如下：

从报错信息可以看出是TS的类型检查报错（不影响项目编译），是因为动态索引使用了string类型，但是icons.ts文件中没有预设索引的类型，从而引发了报错。

JS是弱类型语言，所有类型可以隐式转换，比如你希望将number类型的变量变为string，直接加引号即可

// An highlighted block
let num = 1;
num = '1' //这时num变量已经由number类型自动转换为string类型了

但是TS是微软开发的类似于c或者java等语言的强类型语言，不会做任何的隐式转换，类型不对会直接报错。

最开始尝试了直接修改icons.ts中的属性的类型，即
在这里插入图片描述
这种操作还是局限于JS这种弱类型语言的隐式转换了，自然也是碰壁了。
在TS中，需要显式的声明attribute的类型，即如下：

至此，TS的检查类型不会再报错。

相信大家根据代码也看出我在做什么了，没错就是封装本地的svg图标库，网上教程参差不齐，各种安装插件，下一篇文章介绍如何封装本地svg图库，不需要任何插件。