“react-dnd”不包含名为“DragDropContext”的导出

Question

我尝试在我的 React Web 应用程序中使用 react dnd。我创建了一个 js 文件调用withDnDContext.js。当我编译它时，我收到一个错误'react-dnd' does not contain an export named 'DragDropContext'。我的 react-dnd 版本是最新的 9.3.2

这是我的 withDnDContext.js

import { DragDropContext } from 'react-dnd'
import HTML5Backend from 'react-dnd-html5-backend'

export default DragDropContext(HTML5Backend);

有谁知道如何解决这个问题？

Answer 1

如果使用最新版本的react dnd，DragDropContext已经替换为DndContext. 请参阅React-DnD V8

我的顶部组件看起来像这样；

import { React } from 'react';
import { DndProvider } from 'react-dnd';
import HTML5Backend from 'react-dnd-html5-backend';

export default class MyApp {
    render() {
        return (
            <DndProvider backend={HTML5Backend}>
                <MyComp />
            </DndProvider>
        );
    }
}

该文档或概述可能是非常有帮助的！

Answer 2

用大括号包裹 HTML5Backend 解决了我的问题。

import { HTML5Backend } from 'react-dnd-html5-backend'