reactjs - 对表进行 react 排序

Question

我正在尝试使用 react-sortable-hoc与 bulma tables ，因此 SortableItem 将是 tr。问题是这样的:对于在 bulma 中获得样式的表行，它需要有一些具有类 table 的父 table 元素。尝试移动 tr 时，因为它正好位于 body 元素末尾之前，所以它没有 table 父元素再这样下去，所有的样式都丢失了，行也崩溃了。

我该如何解决这个问题？我已经看到其他拖放库(不是特定于 React 的)通过本质上截取元素并移动 img 来解决此类问题......如果我可以操纵它已经帮助我了tr 是如何附加到正文的。如果我不能用 react-sortable-hoc 解决这个问题，是否还有另一个轻量级的 dnd-react-library 可以做到这一点？在此先感谢您的帮助。

Answer 1

我最终能够使用提供的事件(updateBeforeSortStart 和 onSortStart)的组合来解决这个问题。方法是这样的:

1. 获取 updateBeforeStart 中的节点，使用 window.getComputedStyle 保存其所有子节点的样式
2. 在 onSortStart 中，获取行(这被硬编码为 document.querySelector(body > tr:last-of-type)，这有点难看并将样式应用于其所有子项

这是概述 here并由我稍作修改。