ts踩坑!在类型“xx”上找不到具有类型“string”的参数的索引签名;或者:元素隐式具有“any”类型,因为类型为“string”的表达式不能用于索引类型

您所在的位置:网站首页 找不到编译动态表达式所需的一种或多种类型的数据 ts踩坑!在类型“xx”上找不到具有类型“string”的参数的索引签名;或者:元素隐式具有“any”类型,因为类型为“string”的表达式不能用于索引类型

ts踩坑!在类型“xx”上找不到具有类型“string”的参数的索引签名;或者:元素隐式具有“any”类型,因为类型为“string”的表达式不能用于索引类型

2024-07-13 14:11:50| 来源: 网络整理| 查看: 265

报错信息如下1:

在类型 “{ themeName: string; remark: string; platformName: string; platformLogo: string; footerText: string; recordNo: string; recordUrl: string; helpEnter: string; themeColor: string; topBar: string; … 9 more …; themeId: ID; }” 上找不到具有类型为 “string” 的参数的索引签名。

这个错误信息表示你正在尝试使用一个字符串索引去访问一个类型化对象,但这个对象没有定义索引签名(index signature),也就是说它不允许你使用字符串作为键来动态地访问其属性。

在TypeScript中,一个对象类型如果希望支持通过字符串索引来访问属性,它需要一个索引签名,类似于以下形式:

interface MyInterface { [key: string]: string; // 索引签名,允许通过字符串索引访问值,这个需要写在第一行,不可放到其他属性后边。 themeName: string; remark: string; // ... 其他属性 }

但是,由于你给出的类型定义已经明确地列出了所有属性,并且每个属性都有具体的类型,所以TypeScript编译器不会自动添加一个索引签名。如果你尝试使用像obj[‘someNonExistingProperty’]这样的语法去访问一个不存在的属性,并且你的类型没有索引签名,TypeScript就会抛出错误。

例如,如果你有以下类型定义:

type MyType = { themeName: string; remark: string; // ... 其他属性 themeId: ID; // 假设ID是一个已定义的类型 }; const myObj: MyType = { // ... 初始化对象 };

// 假设我们试图访问一个不存在的属性 const value = myObj[‘nonExistingProperty’]; // 这会触发错误,因为没有索引签名 为了解决这个问题,你应该确保你访问的属性在类型定义中确实存在。如果你需要动态地访问属性,并且不确定属性是否存在,你可以使用可选链(Optional Chaining)来避免运行时错误:

const value = myObj['possibleExistingProperty']?.toString(); // 如果'possibleExistingProperty'不存在,value将会是undefined

或者,如果你确实需要支持通过字符串索引访问属性,你可以添加一个索引签名到你的类型定义中,但这通常不是一个好的做法,因为它会允许你访问任何字符串键,即使这些键在类型定义中不存在。如果你只是想捕获可能存在的属性,并且不关心它们的类型是否都是字符串,你可以添加一个宽松的索引签名,但请注意这可能会隐藏类型检查中的错误:

type MyTypeWithIndex = { // ... 现有的属性 [key: string]: unknown; // 允许通过任何字符串键访问,但值的类型是unknown };

但是,通常最好避免使用这种宽松的索引签名,除非你确实有这样的需求,并且清楚它的后果。

报错信息2:

元素隐式具有“any”类型,因为类型为“string”的表达式不能用于索引类型…

在这里插入图片描述 该问题是因为你没有给styles对象定义类型,且没有“string”的索引类型 解决办法: 给对象定义类型, 可添加 Record 类型,定义了对象的key为string,value为strign类型。 在这里插入图片描述



【本文地址】

公司简介

联系我们

今日新闻


点击排行

实验室常用的仪器、试剂和
说到实验室常用到的东西,主要就分为仪器、试剂和耗
不用再找了,全球10大实验
01、赛默飞世尔科技(热电)Thermo Fisher Scientif
三代水柜的量产巅峰T-72坦
作者:寞寒最近,西边闹腾挺大,本来小寞以为忙完这
通风柜跟实验室通风系统有
说到通风柜跟实验室通风,不少人都纠结二者到底是不
集消毒杀菌、烘干收纳为一
厨房是家里细菌较多的地方,潮湿的环境、没有完全密
实验室设备之全钢实验台如
全钢实验台是实验室家具中较为重要的家具之一,很多

推荐新闻


图片新闻

实验室药品柜的特性有哪些
实验室药品柜是实验室家具的重要组成部分之一,主要
小学科学实验中有哪些教学
计算机 计算器 一般 打孔器 打气筒 仪器车 显微镜
实验室各种仪器原理动图讲
1.紫外分光光谱UV分析原理:吸收紫外光能量,引起分
高中化学常见仪器及实验装
1、可加热仪器:2、计量仪器:(1)仪器A的名称:量
微生物操作主要设备和器具
今天盘点一下微生物操作主要设备和器具,别嫌我啰嗦
浅谈通风柜使用基本常识
 众所周知,通风柜功能中最主要的就是排气功能。在

专题文章

    CopyRight 2018-2019 实验室设备网 版权所有 win10的实时保护怎么永久关闭