reactjs - 打字稿 - 使用键变量更改字典的值

Question

我有一个对象：

const sampleExpenseData = {
  Time: "11-12-19",
  Meals: 5130,
  Pantry: 10,
  Living: 10,
  Others: 0,
  Total: 74
}

我想定义一个函数，以便更新特定键的值，到目前为止我所拥有的是：

const updateValueInDict = (
  obj: typeof sampleExpenseData,
  key: keyof typeof sampleExpenseData,
  upDatedValue: string | number
): void => {
  obj[key] = upDatedValue  // this line throws error
}

错误说：

键入'字符串 | number' 不可分配给类型 'never'。

类型“字符串”不可分配给类型“从不”.ts(2322)

蒂亚！！！

标签： reactjstypescript

Answer 1

这里的问题是，如果您要为任意键分配值，那么该值必须具有可分配给您可能分配给它的每个键的类型。这意味着值的类型必须是string & number可以分配给属性类型string和number属性类型的。交点string & number是never。

解决方案是使用泛型类型，因此upDatedValue根据 的类型限制为具有正确的类型key：

const updateValueInDict = <K extends keyof typeof sampleExpenseData>(
  obj: typeof sampleExpenseData,
  key: K,
  upDatedValue: (typeof sampleExpenseData)[K]
): void => {
  obj[key] = upDatedValue
}

这也意味着在调用函数时可以更严格地对参数进行类型检查。

游乐场链接