如何使用处理程序动态添加下拉选择的值？

Question

我不知道如何从基于提取的数据[药物]动态创建的多个下拉列表中获取值。

我有1个输入和2个下拉菜单。

each one with its own handler:
- Amount   : handleChangeDoseAmount
- Unit     : handleTimeUnitClose
- Interval : handleToolClose

任何人都可以提出解决方案或适当的例子吗？

  handleChangeDoseAmount = (index) => {
    return (event) => {
      console.log(index)
      this.setState([ { unitCount: event.target.value } ])
      this.props.handleAddDoseAmount(0, [event.target.value])
    }
  }

  handleTimeUnitClose = (index, item) => { // changing here
    this.setState({ timeUnitEL: null, timeUnitName: item !== 'close' ? item : this.state.timeUnitName })
    this.props.handleAddDoseInterval(0, [item])
  }
  handleToolClose = (index, item) => {
    this.setState({ toolEL: null, toolName: item !== 'close' ? item : this.state.toolName })
    this.props.handleAddDoseUnit(0, [item])
  }
  handleTimeUnitOpen = event => { this.setState({ timeUnitEL: event.currentTarget }) }
  handleToolOpen = event => { this.setState({ toolEL: event.currentTarget }) }

这是渲染的组件：

  <div>{
          <ul>
      {drugs.map((drug, index) => {
        return [
        <h3 key="first">How often do you take {drug.name}?</h3>,
          <HowOften
                        key="second"
 onChangeUnitCount={this.handleChangeDoseAmount(index)}
 onTimeUnitClose={(i) => this.handleTimeUnitClose(index, i)} // change
                        onTimeUnitOpen={this.handleTimeUnitOpen}
 onToolClose={(ii) => this.handleToolClose(index, ii)} // change
                        onToolOpen={this.handleToolOpen}
                        timeUnitEL={timeUnitEL}
                        timeUnitList={timeUnitList}
                        timeUnitName={timeUnitName}
                        toolEL={toolEL}
                        unitCount={unitCount}
                        toolList={toolList}
                        toolName={toolName}
                        howOftenId={'how-often-id'}
                      />]
                  })}
                </ul>
              }</div>

谢谢