如何使用redux和redux承诺将多个axios调用合并到一个有效负载中？
我正在尝试执行一个操作，执行两个单独的API调用，然后将数据合并到一起，然后传递给还原器。我尝试使用承诺进行第一次调用，然后将数据与axios的transformResponse合并到其中，但我始终得到一个未指明的错误:操作必须是普通的对象。使用自定义中间件进行异步操作.错误。
做这件事最好的方法是什么？
回答 1
Stack Overflow用户
发布于 2016-12-13 22:27:20
重要的是，减速器总是同步的。所以减速机不应该得到承诺。行动应仅由普通数据组成，并采取以下形式：
{
type: 'ADD_TODO',
payload: {
text: 'Do something.'
}
}redux-承诺允许我们在行动的有效载荷中做出承诺。
一旦redux承诺被添加到中间件链中，我们就可以分派在它们的有效负载属性中有承诺的操作。
redux承诺中间件随后将在它到达存储之前处理此操作，并在承诺被解决或拒绝后分派任何进一步的操作，并且在每种情况下有效负载将由响应或错误组成。
一旦承诺被解决或拒绝，由redux承诺执行的这些进一步的操作是同步的，就像发出的任何操作一样。记住，我们的中间件的工作是在(动作有效负载中的承诺已经解决或拒绝后)分派额外的操作()。
调度操作->中间件(redux-承诺分发进一步的操作)->还原程序从这些进一步操作中获取错误或数据->由还原程序更新的存储
下面是一个自成体系的示例，我们将向开放的电影数据库api请求电影数据，以演示redux承诺是如何工作的。
先去商店
store.js
import { createStore, combineReducers, applyMiddleware } from 'redux'
import promiseMiddleware from 'redux-promise'
let rootReducer = combineReducers(reducers)
let store = createStore(
rootReducer,
applyMiddleware(promiseMiddleware)
)现在，我们需要传递redux的applyMiddleware函数作为一个参数来创建存储，然后提供redux承诺作为applyMiddleware的一个参数。
现在是动作创造者。
在下面调用动作创建者函数时，将发出axios请求。这个请求将返回一个承诺，然后通过我们的redux承诺中间件传递。
actions/index.js
export function requestMovie(movieTitle) {
// create the url for our api request
const url = `http://www.omdbapi.com/??=${movieTitle}&y=&plot=short&r=json`
return { // return our action
type: 'REQUEST_MOVIE',
payload: axios.get(url) // this .get method returns a promise
}
}我们的减速机将得到我们承诺的结果。
主函数处理承诺被拒绝或解决后由redux承诺中间件分派的操作。
reducers/index.js
import { combineReducers } from 'redux';
const rootReducer = combineReducers({
movies: movies,
err: err
});
function err(err = false, action){
switch (action.type) {
case 'REQUEST_MOVIE':
return(action.payload.response.status !== 200)
}
return err;
}
function movies(movies = [], action){
switch (action.type) {
case 'REQUEST_MOVIE':
// if promise was not rejected the data property on our action payload will exist comprising the movie data that we requested
if(action.payload.response.status === 200){
return [...movies, action.payload.response.data]
} else{
return [movies]
}
}
return movies
}
export default rootReducer;https://stackoverflow.com/questions/41130053
复制相似问题
腾讯云开发者
