如何一个接一个地分派两个异步redux动作?

问题描述 投票:0回答:1

[在我的componentDidMount中,我正在分派两个动作创建者,即两个都一个接一个地被调用。在第一次调度的api调用中获取的结果将用作第二次调度的api调用中的参数。我如何做到这一点,以便我的第二个调度调用始终从第一个api调用获取更新的结果值。另外,我不能在第一个动作创建者内部调用第二个调度,因为它们都需要分开才能重用。如果已经问过这个问题,我很抱歉,我只是在为我的用例寻找一个完美的解决方案。

componentDidMount() {
  const { setLeadTypesAsync ,setRadarLeadsAsync } = this.props;
  setLeadTypesAsync(); //first dispatch
  setRadarLeadsAsync();  //second dispatch
}

//First dispatch call
export const setLeadTypesAsync = () => {
 return (dispatch) => {
 dispatch(setLeadTypesStart());
 fetchLeadTypes()  //Api service
  .then(({ data: { message, types } }) => {
    if(types) {
      dispatch(setLeadTypesSuccess(types)); //Setting a state called leadTypes
    }
    else {
      dispatch(setLeadTypesError(message));
    }
 })
}};

//Second dispatch call
export const setRadarLeadsAsync = () => {
 return (dispatch, getState) => {
 dispatch(setRadarLeadsStart());
 const { leadTypes } = getState().leads
 console.log(leadTypes);    //Getting the initial value [] instead of updated value
 fetchRadarLeads(leadTypes).then(data => {   //Api service
   console.log(data)
 })
}};
reactjs redux redux-thunk
1个回答
0
投票

使用异步/等待将起作用

async componentDidMount() {
  await this.props.setLeadTypesAsync(); //first dispatch
  await this.props.setRadarLeadsAsync();  //second dispatch
}
© www.soinside.com 2019 - 2024. All rights reserved.