Question

我是reactjs的新手，我想在应用程序中添加onchange。我正在使用地图功能存储数据。

onChange = (event,k,i) => {
     this.setState({

      dList: update(this.state.dList[k][i], {
        [event.target.name]:
          {$set: event.target.value} 
      })
    })
  }

Answer 1

您应该在onChange html标记属性中放置一个onChange函数。

示例：

<input type="text" value={this.state.value} onChange={this.handleChange} />

Reference

Answer 2

如果要更新组件的状态（取决于组件的先前状态），请使用以函数为参数的setState的重载版本。这是因为对setState函数的调用被分批处理以提高性能。

onChange = (event,k,i) => {
     this.setState(prevState => {
      dList: update(prevState.dList[k][i], {
        [event.target.name]:
          {$set: event.target.value} 
      })
    })
}

Answer 3

状态示例

state = {
    name:'',
    password:''
}

如果您多次输入示例名称和密码

<input type="text" name="name" value={name} onChange={this.handleChange} />

<input type="password" name="password" value={password} onChange={this.handleChange} />

这是您如何应用onchange处理程序

handleChange = e => {
    this.setState({[e.target.name]: e.target.value})
}

如何在React JS应用程序中添加onchange事件

3 个答案: