对于对象中存在未知类型的key不能用于索引问题的处理

407 阅读1分钟

开发中遇到的问题: 元素隐式具有 "any" 类型,因为类型为 "number" 的表达式不能用于索引类型 "{ 1: string; 2: Element; 3: Element; }"。 在类型 "{ 1: string; 2: Element; 3: Element; }" 上找不到具有类型为 "number" 的参数的索引签名。

POPO20230202-142331.jpg 问题原因: key值的类型不是string,在js中是默认转好的,而在ts中则不是,要么转化,要么声明,要么忽略 所以应对方案主要有这三种 1.忽略 需要在tsconfig.js中compilerOptions里边新增忽略的代码,添加后则不会报错

"suppressImplicitAnyIndexErrors":true

2.声明 在定义的interface里对其进行声明

interface IFoo {
    [key: number]: string | JSX.Element;
}

还有一种声明方式

  type numberKey = Record<number, string>
  const validityTip: numberKey = {
    1: "11",
    2: "22",
    3: "33",
  };

3.对其使用keyof进行判断

export function isValidKey(key: string | number | symbol , object: object): key is keyof typeof object {
  return key in object;
}

for (const key in obejct) {
	if(isValidKey(key,obejct)){
		// 处理...
		obejct[key]
		....
	}
}