在 chrome 应用商店安装 Redux DevTools
扩展程序,可以帮助开发者更好地调试 Redux。
Redux DevTools 默认是关闭的。官方建议在开发环境下开启,在生产环境下关闭,以避免数据泄漏。
在基础的 Store 中开启 Redux DevTools
。
// store/index.js
import {createStore} from 'redux'
import reducer from './reducer'
export default createStore(
reducer,
// 需判断环境,仅在开发环境下添加以下一行代码
window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
);
在使用了中间件的 Store 中开启 Redux DevTools
。
import {createStore, applyMiddleware, compose} from 'redux'
import thunk from 'redux-thunk'
import reducer from './reducer'
// 需判断环境,仅在开发环境下添加以下一行代码
// 如果安装了 redux devtools 扩展程序,则使用 redux devtools 扩展程序,否则使用 redux 中默认提供的 compose
const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose
export default createStore(reducer, composeEnhancers(applyMiddleware(thunk)))