redux-thunk

Posted 2021-12-20 ssw-men

前端交互中有很多行为是异步的，比如从服务器拉取论坛帖子列表，而目前store.despatch()方法接收的只能是一个拉取帖子的action对象然后交给reducer计算出state。要进行从服务器的拉取操作就要编写一个异步的action，在这个action里会调用store对象的dispatch方法派发同步的action来修改state的状态，从正在获取帖子列表到收到从服务器发来的列表信息。异步的action返回的不是对象而是一个函数，但store.dispatch()方法接收的是一个对象，所以我们要改变一下dispatch方法，并且要把dispatch方法和getState方法传入到异步action中。这时就要使用redux的中间件功能。redux-thunk中间件提供了使dispatch方法接收一个函数的功能，然后在使用redux提供的applyMiddleware函数来使用中间件。中间件其实就是将一个函数改写从而加入一些其他功能。中间件的使用并未改变redux的运行方式 action => store => ui，中间件仅仅是扩展了其功能，redux-thunk使得action可以变成一个可以执行异步逻辑的action，将和服务器的通信放在异步action中，最后还是要调用同步action传入store来更新state。