输入'{ [x: number]: any; }' 缺少 Pick<T, keyof T> 中的以下属性

Question

我有这个代码

interface FormState {
    cardNumber: string,
    month: string,
    year: string
}

    handleInputChange = (event: React.ChangeEvent<MaskedInput>) => {
        this.setState({
            [event.target.name]: event.target.value
        });
    };

TypeScript 不知道 event.target 的 name 属性是什么，但我知道它总是匹配 FormState 键。与 value 属性.

类似

我尝试使用类型断言修复它，但仍然出现错误

type ObjectKey<T> = keyof T;
type ValueOf<T> = T[keyof T];

[event.target.name as ObjectKey<FormState>]: event.target.value as ValueOf<FormState>

我该如何解决这个问题？

Answer 1

只需在 React.ChangeEvent 中添加目标名称的类型:

handleInputChange = (event: React.ChangeEvent<{name: keyof FormState}>) => {

由于您正在处理输入更改，因此更好的类型是 React.ChangeEvent<HTMLInputElement>:

type TargetName=keyof FormState
const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {
    let name = event.target.name as TargetName
    name===''
};

输入'{ [x: number]: any; }' 缺少 Pick<T, keyof T> 中的以下属性

Type '{ [x: number]: any; }' is missing the following properties from Pick<T, keyof T>

typescript

react-typescript

type-assertion