javascript - 单击 Materialize-css React 按钮内的图标会触发 onClick

Question

单击按钮会适本地触发 onClick，但单击按钮内的图标也会触发 onClick，但没有正确的数据(item.target.className 等)

<button id={check} onClick={this.changeTimesButton} className="waves-effect waves-light btn"><i className="material-icons">check_box</i></button>

是否有办法禁用图标被点击

在react项目中使用materialize-css

Answer 1

如果你无法在 this.changeTimesButton(event) 中处理 event.target :

在图标标签上设置 onClick() 然后阻止默认操作

    <button id={check} onClick={this.changeTimesButton} 
      className="waves-effect waves-light btn">
      <i className="material-icons" onClick={(e)=>{e.preventDefault()}}>check_box</i>
    </button>

更新

您可以使用stopPropagation代替preventDefault

有关 stopPropagation 和 PreventDefault 的更多详细信息，请参阅:

What's the difference between event.stopPropagation and event.preventDefault?