Question

我尝试将react-beautiful-dnd与React Semantic UI Table结合使用，但是由于provider.innerRef问题（https://github.com/atlassian/react-beautiful-dnd/blob/master/docs/guides/using-inner-ref.md），我无法使其正常工作。我已经看到一些用户也遇到了材料ui的类似问题。（Use material-ui table with react-beautiful-dnd）。以下是适用于普通html表但不适用于语义ui react表的代码示例：https://codesandbox.io/s/l467j0wj7m。我将不胜感激任何反馈，解决方案或解决方法。

Answer 1

我遇到了同样的问题，找到了解决方法here。

在Ref周围放置Table.Body并将provided.innerRef设置在Ref而不是Table.Body上：

{(provided, snapshot) => (
    <Ref innerRef={provided.innerRef}>
        <Table.Body {...provided.droppableProps}>
        </Table.Body>
    </Ref>
)}

与Table.Row相同：

{(provided, snapshot) => (
    <Ref innerRef={provided.innerRef}>
        <Table.Row  {...provided.draggableProps}
            {...provided.dragHandleProps}>
        </Table.Row>
    </Ref>
)}

应该可以解决问题。另请参阅：https://github.com/atlassian/react-beautiful-dnd/issues/859

React Beautiful DND无法与React Semantic UI Table一起使用

1 个答案: