MichaelGodHelpPlease

gistfile1.jsx

Child Component
  onChangeHandler (val, name) {
    // Is there anyway that I can share the handler among different Select while keeping in mind that which Select(corresponding to entry) is called ?
    this.props.onChange(val, name)
  }
  render () {
    <Select name="select1" value={this.props.data["select1"]} options=this.props.options onChange={value => this.onChangeHandler(value, 'select1')} />
    <Select name="select2" value={this.props.data["select2"]} options=this.props.options onChange={value => this.onChangeHandler(value, 'select2')} />
    <Select name="select3" value={this.props.data["select3"]} options=this.props.options onChange={value => this.onChangeHandler(value, 'select3')} />
    <Select name="select4" value={this.props.data["select4"]} options=this.props.options onChange={value => this.onChangeHandler(value, 'select4')} />
  }
  

Parent Component
  this.props.data = [{select1: 123, select2: 123 ...}, {}, {}]
  this.props.selected_row = 1

  onChangeHandler (val, entry) {
   //
  }

  render () {
    <Child data={this.state.data[this.props.selected_row] onChange={this.onChangeHandler.bind(this)} />
  }