axios通过api响应映射并进行多个api调用

时间:2017-10-31 20:57:50

标签: redux react-redux axios

我需要实现类似下面的内容 - 从第一个api调用获取响应并获得响应 - 在循环第一个响应对象时形成链接并进行后续api调用 - 以下代码适用于第一次调用 - 但不适用于下一次调用?

从'axios'导入请求;

export function getData() {
  return async function getData(dispatch) {
    const { data } = await getDataFromApi();
    dispatch({ type: GET_DATA, payload: data });
    Object.keys(data).map((keyName, keyIndex) => {      
    Request.get(endpoint).then((response) => {
    dispatch({
      type: GET_SUBSEQUENTCALLS + keyIndex,
      payload: response });
  });
});

}; }

async function getDataFromApi() {
  return Request.get(endpoint);
}

1 个答案:

答案 0 :(得分:0)

这是我的例子

let getTopStories = () => axios.get('https://someapi.com/v0/topstories.json');
let getStory = ( id )  => axios.get(`https://someapi.com/v0/item/${id}.json`);
let getUser = ( user ) => axios.get(`https://someapi.com/v0/user/${user}.json`)
let consolidateData = ( storyID ) => new Promise( ( resolve, reject ) => {

  let consolidated = {};

  getStory( storyID )
  .then( storyData => {
    let user = storyData.data.by;
    Object.assign( consolidated, { story: storyData.data } );
    return getUser( user );
  })
  .then( userData => {
    Object.assign( consolidated, { user: userData.data } );
    resolve( consolidated );
  });

});

getTopStories()
    .then( res => {
    let ids    = res.data;
    let random = _.sampleSize( ids, 10 );
    let proms  = random.map( consolidateData );
    return Promise.all( proms );
    }).then( storyData => {
    console.log( storyData );
  this.setState({ storyData })
    });