ts在对象中取值报错

1,471 阅读1分钟

代码如下

const statusMap = {
    [STATUS_ID.TO_CONFIRM]: Lang.padding,`
    [STATUS_ID.TO_LOGIN]: Lang.checkIn,`
    [STATUS_ID.TO_LOGOFF]: Lang.checkOut,`
    [STATUS_ID.LOGOFF]: Lang.rOut,`
    [STATUS_ID.REJECTED]: Lang.rrefuse,`
    [STATUS_ID.EXPIRED]: Lang.overdue,`
    [STATUS_ID.CANCEL]: Lang.rrevoke,`
    [STATUS_ID.SYSLOGOFF]: Lang.systemSignOff,`
};
return statusMap[status];

如果这样写,就会报ts的检查错误

因为statusMap这个对象里只有11-18这几个key,传一个不确定值的status进去的时候,ts就报错了

所以给这个对象后面加个as any即可解决这个问题(把该类型当做any类型)

解决方法:使用Map

代码如下

export const STATUS_ID: [number, string][] = [
    [11, 'padding'],
    [12, 'checkIn'],
    [13, 'checkOut'],
    [14, 'rOut'],
    [15, 'rrefuse'],
    [16, 'overdue'],
    [17, 'rrevoke'],
    [18, 'systemSignOff'],
];

export const renderStatusText = (status: number, Lang: any) => {
const newMap = new Map<number, string>(STATUS_ID);
const res = newMap.get(status) as string;
return Lang[res];

其中这个STATUS_ID也是写在其他文件里引入的,相当于renderStatusText只写了三行代码,更加简洁。
这里要注意几个点:
第一个:new Map()可接收一个数组(和 new Set()一样),返回一个Map类型的变量,具体数组要写成什么形式,就和代码里展示的一样
第二个:可以看到TS中定义一个多种类型的数组要怎么定义,数组里头又是数组要怎么定义,也在代码中显示
第三个: const res = newMap.get(status) as string;这句里的as string也是不得已而为之,不知道有没有更好的办法让这个get返回的就是string(目前ts认为可能返回undefined
我觉得这是最优解了,不过这样写的话,这个常量集合就得写成数组,而不是enum了,也算个小缺陷把