reactjs - 无法在 redux 开发工具中查看状态数据
问题描述
我正在学习 redux 并想出了一个使用返回数据的 web 服务的示例。一切正常。但是我在下面配置了 redux 开发者工具。
我收到一条错误消息,说我的商店被分配了一个值但从未使用过,当我进入我的开发工具时,我看不到我的状态数据。难道我做错了什么?
import React from 'react';
import ReactDOM from 'react-dom';
import { BrowserRouter as Router, Route } from 'react-router-dom';
import promise from 'redux-promise';
import { Provider } from 'react-redux';
import { createStore, applyMiddleware, compose } from 'redux';
import reducers from './reducers';
import ProductsIndex from './components/products_index';
const createStoreWithMiddleware = applyMiddleware(promise)(createStore);
const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
const store = createStore(
reducers,
composeEnhancers(applyMiddleware())
);
ReactDOM.render(
<Provider store={createStoreWithMiddleware(reducers)}>
<Router>
<div>
<Route path="/" component={ProductsIndex} />
</div>
</Router>
</Provider>
, document.querySelector('#root'));
错误:第 14:7 行:“商店”被分配了一个值,但从未使用过 no-unused-vars
解决方案
这是我通常做的事情。
configureStore.js
import { createStore, applyMiddleware, compose } from "redux";
import thunk from "redux-thunk";
import logger from "redux-logger";
import createRootReducer from "../reducers";
const middleware = window.ENV.environment === "local" ? [thunk, logger] : [thunk];
const composEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
const enhancer = composEnhancers(applyMiddleware(...middleware));
const configureStore = (initialState) => {
return createStore(createRootReducer(), initialState, enhancer);
};
export default configureStore;
应用程序.js
import configureStore from "./configureStore";
const store = configureStore();
const App = () => {
return (
<Provider store={store}>
<BrowserRouter basename={process.env.PUBLIC_URL}>
// ...
</BrowserRouter>
</Provider>
);
};
推荐阅读
- nginx - 如何在来自 nginx 代理服务器的上游请求中传递标头?
- ios - 如何在快速解析时检查用户是否已在注册时使用电话号码或新用户注册的条件
- google-data-studio - Datastudio:是否可以将表格用作ie的数据源。饼形图?
- bash - 直接使用脚本或命令删除 solaris 上的主机文件条目
- google-apps-script - 谷歌表格数据验证下拉菜单显示值但粘贴公式?
- javascript - exif-js 方向在 android 上总是返回 0 但在桌面上工作
- sql-server - 如何在 SQL Server 中缩小 mdf 文件而不会出错?
- angular - 在 Angular 中使用具有不同服务的指令
- android - KeyguardManager.isKeyguardSecure 导致 StrictMode 策略违规
- c++ - MySQL C++ 连接器循环