Question

我有一个场景，我有一个登录页面Page-X，在该页面上，组件x1从我用componentDidMount()方法处理过的fetch API调用中获取数据，直到获取数据为止，显示加载的gif。

现在，当我单击Page-X上的组件y1时，将打开一个模态，并在关闭模态下，组件gif的加载gif返回，并且看起来redux存储已从获取数据的位置清除了x1（allallBatchesFromDB-见下文）？那么，当我从模态返回时，是否需要再次进行api调用？如果是，我应该使用哪种生命周期方法？ TIA

 componentDidMount = () => {

     store.dispatch( getDataDBNew(this.props.bugDetails.agentName, this.props.bugDetails.bugId, true,
                true, true, false, 'PFM'));
     console.log("callsed for "+this.props.bugDetails.bugId);
 }

渲染部分：-

let allallBatchesFromDB = store.getState().batchFromDBReducer.batches;

     (allallBatchesFromDB) ?

         <div>
        <Componentx1 /> 
          </div>
            : 

            <img width={40} height={40} src={loadinglinear}/>

                }

获取：

export function getDataDBNew(agentName,bugId,isRegressionChecked,
  isSegmentWiseChecked,isFeatureWiseChecked,
  isDirectCallRequired,featureName){
  return (dispatch)=>{
    axios.post('apiurl', {
      "agentName": agentName,
      "bugId": bugId,
      "isRegressionChecked": isRegressionChecked,
      "isSegmentWiseChecked": isSegmentWiseChecked,
      "isFeatureWiseChecked": isFeatureWiseChecked,
      "isDirectCallRequired": isDirectCallRequired,
      "featureName": featureName,
      "isDBCall" : true  })
  .then(function (response) {
    console.log("got batch new reponse from db"+ JSON.stringify(response));
    return dispatch(fetchBatchFromDBNew(bugId,response));
  })
  .catch(function (error) {
    console.log("getting errrorooror"+error);
  });

}
}

export function fetchBatchFromDBNew(bugId,response){
  return {
    type : ACTIONS_TYPES.FETCH_ALL_BATCH_FROM_DB_ALL_BUGS,
    batches : response.data,
    bugId : bugId
  };
}

减速器：

import {ACTIONS_TYPES} from '../Actions/action';

function batchFromDBReducer(state={batches:{},allBatchesFromDB:{},regressionBatchFromDB:{},segmentBatchFromDB:{},featureBatchFromDB:{}},action){

    var bool =false ;
    if(action.allBatchesFromDB){
        bool = true ;
    }
      switch(action.type){

        case ACTIONS_TYPES.FETCH_ALL_BATCH_FROM_DB_ALL_BUGS:
              return {
                batches: {
                    ...state.batches,
                    [action.bugId]: action.batches
                  }
              }


        default:
        return {
            defaultBatchFromDB : state.regressionBatchFromDB
        }

    }

}

export default batchFromDBReducer;

最新修改 我的构造函数中也有以下代码行：

        store.subscribe(() => this.forceUpdate());

Answer 1

除FETCH_ALL_BATCH_FROM_DB_ALL_BUGS以外，在此期间是否还有其他调度动作？如果是这样，将清除先前获取的数据，因为batchFromDBReducer reducer中的默认处理程序不会扩展到先前的状态。使用以下命令更新默认句柄，看看是否可以解决问题：

return {...state, defaultBatchFromDB : state.regressionBatchFromDB}

如果减速器打算以此方式运行，则在模态关闭时，检查是什么导致了pageX中的重新渲染。如果是道具更改，则可以在componentWillReceiveProps中触发获取。如果是状态更改，请在componentDidUpdate

中执行相同的操作

使用哪种反应生命周期方法

1 个答案: