react-sortable-hoc 与表

Question

我正在尝试将react-sortable-hoc 与bulma tables 一起使用，因此SortableItem 将是tr。问题是这样的：对于要在 bulma 中获取样式的表行，它需要有一些父级 table-element 和类 table。尝试移动 tr 时，因为它被放置在 body-元素的末尾之前，它不再具有 table-parent，所有样式都丢失并且行折叠。

我将如何解决这个问题？我已经看到其他拖放库（不是特定于反应的）通过基本上对元素进行截图并移动img来解决此类问题......如果我可以操纵@987654332的精确度，它已经对我有所帮助@ 附加到正文中。如果我不能用react-sortable-hoc 解决它，是否还有另一个轻量级的 dnd-react-library 可以做到这一点？提前感谢您的帮助。

Answer 1

我最终能够结合使用提供的事件（updateBeforeSortStart 和 onSortStart）来解决这个问题。 方法是这样的：

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

这是here 的概述，我稍作修改。