React event.target不是我设置事件Listener的元素

时间:2017-03-06 19:52:33

标签: javascript reactjs



const onClick = (e) => {
  console.log(e.target);
}
const App = () => (
  <button
    name={'YES'}
    className="btn waves-effect waves-light left blue darken-4"
    onClick={onClick}
  >
    Yes
    <i className='material-icons left'>done</i>
  </button>
);

ReactDOM.render(<App />, document.querySelector("#app"));
&#13;
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.8/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.8/react-dom.min.js"></script>
<div id="app">
&#13;
&#13;
&#13;

在所有可能的情况下,我都需要e.target为<button>,但当我点击<i>(或其他任何元素)时,目标分别为<i>。它可能不是错误,但我不知道如何处理它。

1 个答案:

答案 0 :(得分:3)

使用event.currentTarget,它将始终是添加处理程序的元素。 event.target将始终是发生事件的元素。

<button
  name={answerTypes.YES}
  className="btn waves-effect waves-light left blue darken-4"
  onClick={this.onClick}
>
  Yes
  <i className='material-icons left'>done</i>
</button>

onClick(e) {
  console.log(e.currentTarget);
}