Reactjs 有没有办法用react-sortable hoc或react-Beauty dnd创建一个可排序树？

我正在尝试创建一个列表树，在这里我可以对列表重新排序，还可以在其他元素中拖动元素，而不仅仅是在其他元素的上面和后面

• 但问题是，当我使用

  react sortable hoc

  或

  react beautiful dnd

  时，我只能对元素列表重新排序，但我不知道如何在另一个元素上拖动元素，使其成为子元素和父元素
• 在下面的示例中，可以使用sub

• 在这个代码和框中，我可以更清楚地看到我有一个带有可拖动元素的树。

const rows = [
  { text: "Jhon" },
  { text: "alex" },
  { sub: [{ text: "first" }, { text: "second" }] }
];