天天看点

html使用label添加onClick事件触发两次

<label className="modal-tip--erveryday" onClick={onClickModal}>
  <input type="checkbox"></input>
  <span>今日不再提醒</span>
</label>
           

上述代码会导致click事件触发两次。因为input的click事件会冒泡到label上。

解决方案:给input阻止冒泡

<label className="modal-tip--erveryday" onClick={onClickModal}>
  <input type="checkbox" onClick={onStopPropagation}></input>
  <span>今日不再提醒</span>
</label>