小编ole*_*mal的帖子

我在我的代码中使用了这个简短的示例代码段

<BootstrapTable data={products}>
  <TableHeaderColumn dataField="id" isKey={true}>Product ID</TableHeaderColumn>
  <TableHeaderColumn dataField="name">Product Name</TableHeaderColumn>
  <TableHeaderColumn dataField="price">Product Price</TableHeaderColumn>
</BootstrapTable>

一切都很完美.有桌子,有数据.但是(!)我在Chrome控制台中看到了下一条警告消息:

而如果我使用自己的元素,就没有警告......出了
什么问题？怎么解决？

我有一个React组件并给它onClick事件处理程序:

function Item(props) {
  return <li onClick={props.onClick}>{props.children}</li>
}

然后我像这样使用Component:

<Item onClick={ function(e) {console.log(e.target)} }>
  <span>This element is returned as e.target if clicked on it!</span>
</Item>

单击文本时,span元素将记录为目标,当在给定范围外单击时,li元素将记录为目标.

问题是:如果li元素中有很多子元素,并且必须得到id或name,它就变成了"hacky"任务......

问题是:是否有可能将处理函数作为e.target放入指定onClick的确切元素(不是它的子节点;在本例中为li)？

PS.如果可能的话,没有jQuery解决方案.