Reactjs 元素隐式地具有一个'；任何'；类型，因为表达式的类型为'；字符串'；can'；t用于索引类型'；{…}'；

我正在开发我的react应用程序，从几周前开始我就使用typeScript，但有时我在键入一些变量时仍然会遇到一些问题

以下是错误消息：

TypeScript error in /Users/SignUpFields.tsx(66,9):
Element implicitly has an 'any' type because expression of type 'string' can't be used to     
index type '{ first_name: string; last_name: string; email: string; phone_number: string;     
address: string; adeli: string; password: string; passwordConfirmation: string; }'.
No index signature with a parameter of type 'string' was found on type '{ first_name: 
string; last_name: string; email: string; phone_number: string; address: string; adeli: 
string; password: string; passwordConfirmation: string; }'.  TS7053

接口：

interface IUserData {
 first_name: string;
  last_name: string;
  email: string;
  phone_number: string;
  address: string;
  adeli: string;
  password: string;
  passwordConfirmation: string;
}

我的职能：

handleChanges = (key: string) => (
event: React.FormEvent<HTMLInputElement>
) => {
    let { userData } = this.state;
    let obj: ISignUpFieldsState = this.state;
    for (const k of Object.keys(userData)) {
      if (k ===key){
        console.log('k', k , key);
        userData[k] = event.currentTarget.value;
        this.setState({ userData }, () => this.props.handleChangeFields(obj));
      }
    }
  };

handleChanges=（键：string）=>(
事件：React.FormEvent
) => {
让{userData}=this.state；
让obj:ISignUpFieldsState=this.state；
for（Object.keys的常数k（userData））{
如果（k==键）{
控制台日志（'k'，k，键）；
userData[k]=event.currentTarget.value；
this.setState（{userData}，（）=>this.props.handleChangeFields（obj））；
}
}
};

有一件事！我想用键值修改我的状态以保持通用性，同时保持与每个道具（名字…）的接口具有非常精确的内容。 我看到这样的东西：

[key:string]：string但我真的不喜欢它，因为你从obj“松开”你的道具，它看起来像“任何”类型

谢谢，祝你今天愉快
 试试这个：

handleChanges = <T extends extends keyof IUserData>(key: T) => (
event: React.FormEvent<HTMLInputElement>
) => {
    let { userData } = this.state;
    let obj: ISignUpFieldsState = this.state;
    for (const k of Object.keys(userData)) {
      if (k === key){
        console.log('k', k , key);
        userData[key] = event.currentTarget.value;
        this.setState({ userData }, () => this.props.handleChangeFields(obj));
      }
    }
  };

handleChanges=（键：T）=>(
事件：React.FormEvent
) => {
让{userData}=this.state；
让obj:ISignUpFieldsState=this.state；
for（Object.keys的常数k（userData））{
如果（k==键）{
控制台日志（'k'，k，键）；
userData[key]=event.currentTarget.value；
this.setState（{userData}，（）=>this.props.handleChangeFields（obj））；
}
}
};

现在typescript知道该键只能是IUserData中的一个有效键

另外，一个好的做法是从不改变状态，而是始终返回一个新引用（在上面的示例中，您直接改变userData对象），因此这更好：

    handleChanges = <T extends keyof IUserData>(key: T) => (
    event: React.FormEvent<HTMLInputElement>
    ) => {
    let { userData } = this.state;
    let obj: ISignUpFieldsState = this.state;
    for (const k of Object.keys(userData)) {
      if (k === key){
        console.log('k', k , key);
        userData = {...userData , [key]: event.currentTarget.value};
        this.setState({ userData }, () => this.props.handleChangeFields(obj));
      }
    }
  };

handleChanges=（键：T）=>(
事件：React.FormEvent
) => {
让{userData}=this.state；
让obj:ISignUpFieldsState=this.state；
for（Object.keys的常数k（userData））{
如果（k==键）{
控制台日志（'k'，k，键）；
userData={…userData，[键]：event.currentTarget.value}；
this.setState（{userData}，（）=>this.props.handleChangeFields（obj））；
}
}
};
我从不使用“（key:T）”“我该如何使用它？我该如何阅读一些文档？typescript文档是一个很好的开始：哇，非常令人惊讶的是，我非常惊讶你能用“extends”做什么，比如经常使用obj thx的类型键！（我纠正了一件小事，因为我认为你犯了一个错误）；）谢谢！！没有问题，请点击thx进行编辑。复制粘贴是编程的祸根：P