简要介绍:再看redux文档的时候,发现了createStore是允许第三个参数的,看了一下源码明白了第三个参数的作用。
一、createStore的第三个参数的定义
(1)官方定义:createStore(reducer, [initialState], enhancer),
第三个参数enhancer, 是一个组合 store creator 的高阶函数,返回一个
新的强化过的 store creator。这与 middleware 相似,它也允许你通过
复合函数改变 store 接口。
(2)关于第三个参数的源码:
export default function createStore(reducer, preloadedState, enhancer) {
if (typeof preloadedState === 'function' && typeof enhancer === 'undefined') {
enhancer = preloadedState
preloadedState = undefined
}
if (typeof enhancer !== 'undefined') {
if (typeof enhancer !== 'function') {
throw new Error('Expected the enhancer to be a function.')
}
return enhancer(createStore)(reducer, preloadedState)
}
去掉前面一些类型判断,我们来看这一句:
return enhancer(createStore)(reducer, preloadedState)
这句的形式像什么,柯里化后传入的第一个参数为createStore,这很类
似于我们再定义中间件的时候,applyMiddleware这个函数,这个函数
返回了提升后的createStore。
二、applyMiddleware的两种写法
因此在applyMiddleware的时候,就会存在两种写法,这里我们以利用redux-thunk为例。
(1)直接调用applyMiddleware生成新的createStore
import thunk from 'redux-thunk'
let createStoreWithMiddleware = applyMiddleware(thunk)(createStore)
(2)在createStore中调用
import thunk from 'redux-thunk'
let createStoreWithMiddleware = createStore(reducer,preState,applyMiddleware(thunk))