记录工作中遇到由于 TS 类型导致的错误!

类型报错

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
export type OrgTypeProps = 'company' | 'unit' | 'department' | 'team'

export const ORG_TYPE_OPTS: Record<OrgTypeProps, { text: string; color: string }> = {
company: {
text: '公司',
color: 'cyan',
},
unit: {
text: '单位',
color: 'blue',
},
department: {
text: '部门',
color: 'geekblue',
},
team: {
text: '小组',
color: 'purple',
},
};

image.png

原因分析

有关此问题的答案请参考官方版本:Lack of type check in “for in” expression,如果引入了确切的类型,那么也许这个问题就会消失,看了也不是很明白,原谅我的理解能力,哈哈
按照我的理解:这是 TypeScript 没有正确推断 type 的类型,type 可能是 OrgTypeProps 之外的值,恩,感觉是这样

解决办法

  1. 采用 类型推断 的形式

    1
    type as keyof typeof ORG_TYPE_OPTS

    这样就没报错了
    image.png

  2. 配置 tsconfig.json

    1
    "suppressImplicitAnyIndexErrors": true

既然我们使用了 TypeScript,那我们应该就选择第一种方式,第二种方式有点 any 的感觉,不建议哈!