SyntheticMouseEvent {dispatchConfig: Object, dispatchMarker: ".1.1.0.2.0.0:1", nativeEvent: MouseEvent, type: "click", target
Код верный. Когда запускаю, вижу {column} но не получить событие onClick.
Код:
var HeaderRows = React.createClass({
handleSort: function(value) {
console.log(value);
},
render: function () {
var that = this;
return(
<tr>
{this.props.defaultColumns.map(function (column) {
return (
<th value={column} onClick={that.handleSort} >{column}</th>
);
})}
{this.props.externalColumns.map(function (column) {
// Multi dimension array - 0 is column name
var externalColumnName = column[0];
return ( <th>{externalColumnName}</th>
);
})}
</tr>);
}
});
Используй функцию-стрелку:
Это создаст новую функцию, которая вызывает handleSort с правильными параметрами. А лучше всего так: Извлеки его в sub-компонент. Проблема с использованием функции стрелок в вызове рендеринга заключается в том, что каждый раз будет создаваться новая функция, которая в конечном итоге вызывает ненужные ре-рендеры. Если ты создаешь подкомпонент, можно передать обработчик и использовать props в качестве аргументов, которые затем будут повторно отображаться только тогда, когда prop изменится (поскольку ссылка обработчика теперь никогда не изменяется): Sub-компонент:
Основной компонент: