类型'{[x:string]:string中缺少属性; }"

Question

在这个反应应用程序中,有一个带有几个输入字段的表单.这些字段都this.handleChange与onChange属性一起使用.

private handleChange = (event: React.FormEvent<HTMLInputElement>) => {
    let target = event.target as HTMLInputElement;
    this.setState({
        [target.name]: target.value
    });
};

我得到的打字稿错误是:

ERROR in [at-loader] ./src/components/FormSubmitHighScore.tsx:43:23 
TS2345: Argument of type '{ [x: string]: string; }' is not assignable to parameter of type 'Pick<State, "first_name" | "last_name" | "email_address" | "school_name" | "region" | "submitted">'.
Property 'first_name' is missing in type '{ [x: string]: string; }'.

因此,通过动态设置状态名称字段(基于正在使用的输入),会触发此Typescript错误(但它在浏览器中可以正常工作).

如何在此上下文中指定正确的类型？

Answer 1

不幸的是,在修复这些 错误之前- 你必须使用一些丑陋的解决方法,例如:

this.setState({
    [target.name]: target.value
} as any);

Answer 2

为了避免我使用的"任何"linter警告:

this.setState({
  [target.name]: target.value
} as Pick<State, keyof State>);