Reactjs 带react dragula的嵌套拖放

我正在做一个react项目，我想用react Dragula之类的工具将任务拖到它们的子任务中

代码：

dragulardecorator=（componentbackingstance）=>{
if（组件备份状态）{
此.containers.push（组件后退姿态）
}
};
componentDidMount（）{
this.isMount=true；
让任务=this.props.tasks
this.setState（{allTasks:tasks}）
this.drake=dragula（this.containers{
iContainer:函数（el）{
return el.id===“单个任务”；
},
移动：函数（el、源、句柄、同级）{
返回句柄.classList.contains（'icon-handle'）；
}
});
}

{this.state.allTasks&&（this.state.allTasks.length>0）&&this.state.allTasks.map（（字段，键）=>{
返回(

{field.name}

)
})}

我用上面提到的代码创建了简单的拖放，但我需要在子任务及其子任务中拖动任务，以此类推。因此，请向我建议如何实现我想要的

使用本机库

可以对嵌套元素使用类“嵌套”

className="nested"

并使用查询选择器查找“.nested”

[].slice.apply(document.querySelectorAll(".nested"))

这是一个工作演示

---

谢谢您的回答，但如果子任务移动到主任务中，则它不会作为子任务移动。请再看一看。@VarinderSohal Dragula需要一个容器作为放置区。我已经对代码进行了更改。

[].slice.apply(document.querySelectorAll(".nested"))