事件传播没有停止

Question

我有以下代码。

<div onClick={handleDescrition} className="tasks-main">
                <div className="task-container">
                  <div className="title_actions">
                    <div className="title">
                      <label className="radio-container">
                        <span onClick={ event => { handleTempHide(elem._id); event.stopPropagation();
                          }} onMouseOver={() => handleCheckMark(elem._id)} onMouseOut={() => removeCheckMark(elem._id)} className="checkmark"
                        >
                          {isChecked[elem._id] && (
                            <i className="fa-thin fa-check"></i>
                          )}
                        </span>
                        <p>{elem.name}</p>
                        <input type="radio" checked={isChecked[elem._id]} />
                      </label>
                    </div>

当我单击具有类“checkmark”的 span 元素时，尽管我使用了停止传播方法，但它的事件处理程序与类名称为“tasks-main”的 div 的事件处理程序一起被调用。 总而言之，当我单击 span 元素时，也会单击 tasks-main 元素并调用其事件处理程序。我无法弄清楚为什么调用 tasks-main 的事件处理程序。 请帮助。