How to pass multiple parameters to input's onChange handler

Question

I render collection of input elements for objects in array.

render: function() {
    var ranges = [];
    this.props.ranges.map(function(range, index) {
             


        

Answer 1

I think this way is easier:

    <Input type="text"
                value={range.name}
                onChange={(e) => this.changeRangeName(range.id, e)}
        ...
    onChange(id, e) {
        ...
    }

Answer 2

The event argument is still passed, but the rangeId argument is prepended to the arguments list, so your changeRangeName method would look like

changeRangeName: function (rangeId, event) {
    var newName = event.target.value;
},

See Function.prototype.bind()