本文主要是介绍Redux中Middleware原理,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
Redux中Middleware原理
下面以redux-trunk为示例了解applyMiddleware用于干什么。
redux-thunk/src/index.js
function createThunkMiddleware(extraArgument) {return ({ dispatch, getState }) => next => action => {if (typeof action === 'function') {return action(dispatch, getState, extraArgument);}return next(action);};
}const thunk = createThunkMiddleware();
thunk.withExtraArgument = createThunkMiddleware;export default thunk;
首先由上面代码可以看出trunk是一个({ dispatch, getState }) =>{}这样的箭头函数。
当 applyMiddleware(trunk)执行后,:
redux/src/applyMiddleware.js
export default function applyMiddleware(...middlewares) {return createStore => (...args) => {const store = createStore(...args)let dispatch = () => {throw new Error(`
这篇关于Redux中Middleware原理的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!