React学习28（redux-devtools使用）

安装redux-devtools效果

 如何实现

1）下载插件redux-devtools

2）安装：npm i redux-devtools-extension

3）在store中引入composeWithDevTools，同时暴露的时候对第二个参数进行修改

import {composeWithDevTools} from 'redux-devtools-extension'

export default createStore(allReducer, composeWithDevTools(applyMiddleware(thunk)))

代码示例

store.js

/*
  该文件专门用于暴露一个store对象，整个应用只有一个store对象
*/

//引入createStore，专门用于创建redux中最为核心的store对象,applyMiddleware用于支持
//异步action的中间件
//combineReducers用于合并多个reducer
import {createStore,applyMiddleware,combineReducers} from 'redux'

//引入为Count组件服务的reducer
import countReducer from './reducers/count'

//引入为Person组件服务的reducer
import personReducer from './reducers/person'

//引入redux-thunk，用于支持异步action
import thunk from 'redux-thunk'

//引入redux-devtools-extension
import {composeWithDevTools} from 'redux-devtools-extension'

//汇总所有的reducer变为一个总的reducers
const allReducer = combineReducers({
  he:countReducer,
  rens:personReducer
})

export default createStore(allReducer, composeWithDevTools(applyMiddleware(thunk)))