Question

运行测试脚本时发生错误

不变违反：在“连接（DragD ropContext（App））“。要么将根组件包装在一个，或将自定义React上下文提供程序传递给和连接选项中相应的React上下文使用者连接（DragDropContext（App））。

尽管一切都在未组装的项目中进行。据我了解，由于根组件被包装在两个容器中，其中一个是氧化还原，另一个是dnd，因此存在一些问题。

ReactDOM.render(<DragDropContextProvider backend={HTML5Backend}>
                    <Provider store={store}>
                        <App />
                    </Provider>
                </DragDropContextProvider>, document.getElementById('root'));

我尝试先在dnd中包装，然后在redaks中包装-这样做没有帮助，一切都一样。

Answer 1

似乎您将旧版装饰器API与顶级API混合在一起

旧版装饰程序API

使用旧版装饰器，您可以包装如下：

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

class YourApp {
  /* ... */
}

export default DragDropContext(HTML5Backend)(App)

查看有关Legacy Decorator API here...的文档

顶级API

对于顶级API，您使用：

import { DndProvider } from 'react-dnd'
import HTML5Backend from 'react-dnd-html5-backend'
....
...
        <div className="App">
            <DndProvider backend={HTML5Backend}>
                <App />
            </DndProvider>
        </div>

查看有关顶级API here...的文档

组装后，react + redux + react-dnd上的应用程序无法正常工作，为什么？

1 个答案:

旧版装饰程序API

顶级API