redux触发store更新，使用的dispatch(action),在关于createStore的源码解读中可以看到，store.dispatch限制了action必须是一个纯对象。是为了保持reducer的纯净性
只要传入参数相同，返回计算得到的下一个 state 就一定相同。没有特殊情况、没有副作用，没有 API 请求、没有变量修改，单纯执行计算。
redux-thunk是redux推荐的一个异步处理middleware，它可以在触发store.dispatch之前完成reducer中不能搞定的副作用，比如异步操作。
源码实现
function createThunkMiddleware(extraArgument) {
return ({ dispatch, getState }) => next => action => {
// 如果ation是函数，这调用这个函数，并且传入dispatch和getState
if (typeof action === 'function') {
// 此处的dispatch是在applyMiddleware中改写过的
return action(dispatch, getState, extraArgument);
}
// 如果是对象，这调用下一个middleware
return next(action);
};
}
const thunk = createThunkMiddleware(); // 返回一个middleware
// 提供原函数，可以传递额外的参数
thunk.withExtraArgument = createThunkMiddleware;
export default thunk;
redux-thunk这个middleware可以接受函数类型的action，在action函数中进行各种自定义的操作（延时，接口请求等），然后再使用传入的dispatch触发实际的action动作（纯对象）。这样就不会影响reducer的纯洁性。
实例
异步的action
export function logTime (time) {
return {
type: LOG_TIME,
time
}
}
export function delayLogTime () {
let now = new Date().toString();
return (dispatch) => { //可接受dispatch，getState
// 进行副作用操作
setTimeout( ()=> {
// 实际触发ation
dispatch(logTime(`${now} --- ${new Date().toString()}`))
},1000)
}
}
使用redux-thunk
import thunk from 'redux-thunk'
let store = createStore(reducer,applyMiddleware(thunk))
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
文章由极客之音整理，本文链接：https://www.bmabk.com/index.php/post/229214.html
