Javascript 如何使用React DnD Beauty Library避免嵌套组件中的事件冒泡？

我对事件冒泡有问题。我正在使用React DnD Beauty对垂直列表进行排序。 我有一个集合列表，每个集合中都有一个嵌套的服务列表

我可以通过拖放集合对其进行垂直排序，也可以通过拖放仅在对应集合中的服务对其进行排序

当我拖动集合时，一切都正常工作。但是，当我尝试拖动服务时，有时不是抓取服务，而是抓取整个集合。它是由于事件冒泡而发生的。通常，我会用e.stopPropagation（）解决这个问题，但它似乎不起作用

React DnD Beautiful使用{…provided.dragHandleProps}，例如，它们在其中处理onDragStart。我试着定制它，但没有成功。我想知道，我是否只是定制错了

下面是一个伪代码

收藏清单

函数SortableCollectionsList（）{
常量样式=使用样式（）；
const{sortedCollections，onDragEnd}=useSortedCollections（）
返回(
{（已提供，快照）=>(
//所有收藏的清单
{分类集合
.map（{id，name，showName，logo，services:serviceIds}，index）=>
{（已提供，快照）=>(
{/*一个包含服务列表的集合*/}
{
e、 stopPropagation（），
提供了dragHandleProps.onDragStart（e），
log（“集合停止传播”）
}}
className={styles.collection}
>
{/*一个集合内的服务列表*/}
)}
)}
{提供的.占位符}
)}
)
}