Как передать несколько параметров в обработчик onChange для input?

Проблема с обработкой изменений в массиве объектов в React

Я рендерю коллекцию элементов ввода для объектов в массиве. Вот как выглядит мой код:

render: function() {
    var ranges = [];
    this.props.ranges.map(function(range, index) {
        var rangeElement = <Input type="text"
            value={range.name} onChange={this.changeRangeName.bind(this)} />;
        ranges.push(rangeElement);
    }, this);

    // рендерим ranges
}

Я могу написать обработчик onChange следующим образом:

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

Однако в этом обработчике мне нужен ID объекта диапазона, который я хочу изменить. Я могу изменить способ создания элементов ввода в функции рендеринга:

var rangeElement = <Input type="text"
            value={range.name}
            onChange={this.changeRangeName.bind(this, range.id)} />;

Теперь мой обработчик будет получать range.id в качестве параметра, но теперь у меня нет значения newName. Я могу получить его с помощью refs:

var rangeElement = <Input type="text"
            ref={'range' + range.id}
            value={range.name}
            onChange={this.changeRangeName.bind(this, range.id)} />;

Это единственное решение, которое я знаю, но я подозреваю, что есть более эффективный способ справиться с этой задачей. Можете подсказать, как лучше организовать обработку изменений в данном случае?