Javascript 如何在没有儿童接触的情况下停止冒泡'；s单击处理程序和stopPropagation调用？（可点击包装内的可点击组件）

我需要帮助、建议、精神支持……）

作为一名学员，我参与了UI库的开发，现在有一项任务，就是创建一个像卡片一样的组件——它是一个简单的包装器，具有用于任何其他组件的一些样式。
这里有什么问题？经典-js起泡。
这个包装应该是可点击的，但有些子项也可以点击（使用不同的点击处理程序）

{props.children}//它可以是任何东西，绝对可以是可点击和不可点击的

我在卡片上的点击处理程序中尝试了

e.preventDefault（）

，条件是

e.target！==e、 currentTarget

，但这种方式使得卡片的主要部分无法通过文本、图像等内容点击

我知道

e.stopPropagation（）

，而且效果很好，但我没有直接接触儿童的渠道。 我的意思是，我不知道它们会有什么结构（嵌套）、标签的种类和行为。此外，可能存在根本没有可单击子项的情况。
所以我不能在我这边添加这个电话（我想是的，也许我错了）-在这种情况下，我还能做些什么来停止孩子们的点击呢？
还有别的办法吗

---

您说“e.target！==e.currentTarget”使“卡的主要部分不可点击”，但停止冒泡恰恰是这样，忽略子元素的点击。所以我不明白你的问题。您想忽略来自子项的单击事件，但仅当这些子项没有单击处理程序时？@gforce301是的，您是对的-例如，如果我单击了此卡中的某个按钮，我需要停止冒泡，并运行仅适用于此按钮的操作（例如，打开模式窗口），而不适用于该卡。但是，如果我点击了文本或图像之类的子对象，我需要“传递”这些点击，并运行适用于卡片的操作（例如，转到链接）。这并不是说，如果处理程序添加了reactjs，框架就没有办法获得这些信息。你说“e.target！==e.currentTarget”会使“使卡的主要部分不可点击但停止冒泡恰恰是这样，忽略子元素的点击。所以我不明白你的问题。您想忽略来自子项的单击事件，但仅当这些子项没有单击处理程序时？@gforce301是的，您是对的-例如，如果我单击了此卡中的某个按钮，我需要停止冒泡，并运行仅适用于此按钮的操作（例如，打开模式窗口），而不适用于该卡。但是，如果我点击了文本或图像之类的子对象，我需要“传递”这些点击，并运行适用于卡片的操作（例如，转到链接）。这并不是说，如果处理程序添加了reactjs，那么框架就无法获得这些信息。

<div onClick={doSomething}>
  {props.children}   // it could be anything, absolutely, both clickable and non-clickable
</div>