Bootstrap 4 Shopify Draggable的可排序示例

我需要创建一个类似于trello主视图的视图。其中我有可排序的类别和任务 我想通过可排序的API对booth进行排序

当我将类别可排序设置为活动状态时，当我尝试对任务进行排序时，它也尝试对关联类别进行排序。我理解它为什么这样做，但如何排除？这可以通过Shopify Dragable api实现吗？

我不熟悉Draggable api，我的问题代码示例：

//任务可排序
const sortable=new Draggable.sortable（document.queryselectoral（'ul'）{
可拖动：“李”，
});

第一类

任务1
任务2
任务3
任务4

第2类

任务1
任务2
任务3
任务4

第3类

任务1
任务2
任务3
任务4

第四类

任务1
任务2
任务3
任务4

手柄

选项可以指定拖动的位置。您可以像下面的代码片段一样设置

句柄：“.card header”

，以排除关联类别的排序

见：

//任务可排序
const sortable=new Draggable.sortable(
文件查询选择器所有（“ul”），
{draggable:“li”}
);
//猫可分类
const sortableCat=新的可拖动。可排序(
文件查询选择器所有（“.main div”），
{可拖动：“.category swap”，句柄：“.card header”}
);

第一类

任务1
任务2
任务3
任务4

第2类

任务1
任务2
任务3
任务4

第3类

任务1
任务2
任务3
任务4

第四类

任务1
任务2
任务3
任务4