在这种情况下如何缩小 Typescript 的范围？

Question

以下代码通过表单输入设置对象的属性。输入上的

name

将是属性，值将是目标值。

当

typeof draft

的所有属性均为同一类型（如字符串）时，此方法不会出现类型错误。但是，当类型具有混合属性时，即有些带有字符串，有些带有布尔值等，我会收到以下错误：

never

。

我可以做一些缩小或通用传递来为 TS 提供类型安全所需的东西吗？

  const updateEditedRecord = (event: React.ChangeEvent<HTMLInputElement>) => {
    const { target } = event;
    const val = target.value;

    setEditedRecord((draft) => {
      const name = target.name as keyof typeof draft;
      draft[name] = val; // => Type 'string' is not assignable to type 'never'.
    });
  };

Answer 1

您可以创建一个辅助函数来根据属性类型缩小类型范围，如下所示：

function setProperty<T extends object, K extends keyof T>(obj: T, key: K, value: string) {
  const prop = obj[key];

  if (typeof prop === 'boolean') {
    obj[key] = (value === 'true') as T[K];
  } else if (typeof prop === 'number') {
    obj[key] = (Number(value)) as T[K];
  } else {
    obj[key] = value as T[K];
  }
}

const updateEditedRecord = (event: React.ChangeEvent<HTMLInputElement>) => {
  const { target } = event;
  const val = target.value;

  setEditedRecord((draft) => {
    const name = target.name as keyof typeof draft;
    setProperty(draft, name, val);
  });
};