TS 对象动态key 类型报错问题

有的时候需要用动态key 给对象里的属性赋值或者取值

例子

1.先声明一个接口

interface ICityData {

  provinceCode: string

.......省略

}

2.创建了一个对象(vue3环境演示)

const changeRes: ICityData = reactive({

  provinceCode: '1001010',

.......省略

})

3.比如提交完表单,用动态key把值都赋值为空字符串(此时报错出现了)

for (const key in changeRes) {

changeRes[key] = ''  // 报错: 元素隐式具有 "any" 类型，因为类型为 "string" 的表达式不能用于索引类型

}

4.至于在TS中如何解决这个报错,

changeRes[key as keyof ICityData] = ''    这样写就可以解决了

5.上面演示的情况是 ICityData 里面属性的值的类型都是 string类型,这样写就ok了,但是还有的情况是他里面还有比如 count: number ,isSelected: boolean 这样的类型,或者是一个对象遍历出来值动态循环给另一个对象赋值,总之就是值得类型不再是唯一一种了,此时再按上面写 他会报错,他左侧等着被赋值的类型变成了never

不能将类型“string | number | boolean ”分配给类型“never”。

// 比如多了一个别的类型
interface ICityData {

  provinceCode: string

  count: number

}

 for (const key in changeRes) {
      const tkey = key as keyof ICityData 
      if (tkey === 'count') {
        changeRes[tkey] = 0
      } else {
        changeRes[tkey] = ''
      }
    }