Lorsque setState ({key: value}) dans React, lorsque la clé passée est une variable, la valeur de state est obtenue dynamiquement et définie

Prenons un composant enregistré comme exemple

class Register extends Component {
  constructor(props){
    super(props)
    this.state = {
      username:'',
      password:'',
      password2:'',
      type:'求职者'
    }
  }

Si vous souhaitez modifier les valeurs des quatre attributs d'état via la même méthode handleChange, vous devez passer dynamiquement les paramètres d'attribut, écrire d'abord un mauvais endroit et voir ce qui se passe

handleChange(name,val){
    this.setState({
      name:val
    })
  }

En fait, si le nom dans le code en vscode n'est pas surligné, c'est-à-dire que Ming n'est pas du tout utilisé, c'est aussi un rappel

transfert

<InputItem onChange={(val)=>{this.handleChange('username',val)}} placeholder="请输入用户名">用户名:</InputItem>
<InputItem onChange={(val)=>{this.handleChange('password',val)}} type='password' placeholder="请输入密码">密码:</InputItem>

En conséquence, le rappel est le suivant, et la requête ajax n'est pas envoyée

Modifiez la méthode handleChange en ajoutant des crochets au nom

handleChange(name,val){
    this.setState({
    [name]:val
    })
  }

Le nom est mis en évidence dans vscode

Demande envoyée en douceur