我想读取onClick事件值属性。但当我点击它时，我在控制台上看到类似的内容：
SyntheticMouseeEvent{dispatchConfig:Object，dispatchMarker:“.1.1.0.2.0.0:1”，nativeEvent:MouseeEvent，键入：“单击”，目标
我的代码工作正常。当我运行时，我可以看到{column}，但无法在onClick事件中获取它
我的代码：
var HeaderRows=React.createClass({
handleSort:函数（值）{
console.log（值）；
},
渲染：函数（）{
var=这个；
返回(
<；tr>；
{this.props.defaultColumns.map（函数（列））{
返回(
<；th value={column}onClick={that.handleSort}>；{column}<；/th>；
);
})}
{this.props.externalColumns.map（函数（列））{
//多维数组-0是列名
var externalColumnName=列[0]；
返回（<；th>；{externalColumnName}<；/th>；）；
})}
<；/tr>；
);
}
});
如何将值传递给React js中的onClick事件
捷径
使用箭头功能：
返回(
<；th value={column}onClick={（）=>；this.handleSort（column）}>；{column}<；/th>；
);
这将创建一个新函数，该函数使用正确的参数调用handleSort
更好的方法
将其提取到子组件中。
在渲染调用中使用箭头函数的问题在于每次都会创建一个新函数，从而导致不必要的重新渲染
如果创建子组件，则可以传递处理程序并使用props作为参数，只有当props更改时，才会重新呈现（因为处理程序引用现在从未更改）：
子组件
类TableHeader扩展组件{
handleClick=（）=>{
this.props.onHeaderClick（this.props.value）；
}
render（）{
返回(
<；th onClick={this.handleClick}>；
{this.props.column}
<；/th>；
);
}
}
主要部件
{this.props.defaultColumns.map（（column）=>(
<；表格标题
值={column}
onHeaderClick={this.handleSort}
/&燃气轮机；
))}
旧捷径（ES5）
使用.bind传递所需的参数，这样就可以将函数与组件上下文绑定：
返回(
<；th value={column}onClick={this.handleSort.bind（this，column）}>；{column}<；/th>；
);