我将redux-devtools
和redux-devtools-dock-monitor
和redux-devtools-log-monitor
一起使用。
我遵循了文档。但是,在控制台中,我收到此错误:
index.js:1452 Redux DevTools could not render.
You must pass the Redux store to <DevTools> either as a "store" prop
or by wrapping it in a <Provider store={store}>.
这是我的根组件:
const Root = () => {
return (
<Provider store={store}>
<div>
<h1>Hello !!!</h1>
<DevTools/>
</div>
</Provider>
);
};
export default Root;
此外,我也收到此警告:
redux-devtools@3.4.2" has incorrect peer dependency "react-redux@^4.0.0 || ^5.0.0".
我已经将redux-devtools-log-monitor
和redux-devtools-dock-monitor
用作监视器
答案 0 :(得分:1)
在react-redux@6
中,商店不是通过旧版React上下文传递的,您应该通过以下道具明确地指定商店:
<DevTools store={store}/>
更新1:它对我有用,因为我在主项目中有react-redux@6
,但是对于react-redux@5
依赖项有redux-devtools
。因此,如果有人需要一种快速的解决方法(无论如何,您都不应在生产中包括DevTools组件),直到得到支持,只需执行cd ./node_modules/redux-devtools && npm i react-redux@5
。
更新2:redux-devtools@3.5.0
刚刚发布,它增加了对react-redux@6
的支持。
答案 1 :(得分:1)
我已经尝试过该建议,但现在又给出了另一个错误(我正在使用DockMonitor)。即这是我的设置。
<DockMonitor toggleVisibilityKey='ctrl-h'
changePositionKey='ctrl-q'
changeMonitorKey='ctrl-m' >
<LogMonitor />
</DockMonitor>
<Provider store={store}>
<App />
<DevTools store={store} />
</Provider>
产生以下错误:
未捕获的错误:传递道具中的redux存储已被删除,并且不执行任何操作。要将自定义Redux存储区用于特定组件,请使用React.createContext()创建自定义React上下文,并将上下文对象传递给React-Redux的Provider和特定组件,例如:。您还可以通过{context:MyContext}选项进行连接