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

7 篇文章 0 订阅

报错信息如下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<string,string> 类型,定义了对象的key为string,value为strign类型。
在这里插入图片描述

评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值