Question

不确定我在这里缺少什么。 console.log打印正确的data，但return语句未将值设置为我的redux商店。

// reducer.js

function getPreviousMonthData(state) {
  $.ajax({
    url: uri,
    method: "GET",
    dataType: "json",
    success: (data) => {
      const newObj = {
        previousMonthTotal: data.totals[0],
        previousMonth: data.app_reports
      };
      console.log(newObj);
      return Object.assign({}, state, newObj);
    }
  });
}

在我的应用的每个其他上下文中，return Object.assign({}, state, newObj);成功地将数据设置到我的redux商店，例如：

// reducer.js

function setState(state, newState) {
  return Object.assign({}, state, newState);
}

function setToStore(state, data, label) {
  let newObj = {};
  newObj[label] = data;
  return Object.assign({}, state, newObj);
}

编辑：这是行动的reducer方......我的action-creator有点古怪。更全面的故事是，这个ajax调用是在一系列以不同的ajax调用开始的调度操作结束时发出的。总体目标是（1）基于两个unix时间戳给出的范围接收一组数据; （2）计算前一个月的范围; （3）采用新的日期范围为上个月的数据创建新的获取请求。除了将前一个月的数据最终分配给redux商店外，一切都有效。

// action_creators.js

export function getDataPointQuery(queryObj) {
  const app = queryObj.app_id ? queryObj.app_id : CONFIG.test_app;
  const token = queryObj.token ? queryObj.token : CONFIG.token;
  const start_date = queryObj.start_date ? queryObj.start_date : CONFIG.start_date;
  const end_date = queryObj.end_date ? queryObj.end_date : CONFIG.end_date;
  const uri = CONFIG.host2+"/v3/apps/"+app+"/app_reports?token="+token+"&start="+queryObj.start_date+"&end="+queryObj.end_date;

  return(dispatch) => {
    $.ajax({
      url: uri,
      method: "GET",
      dataType: "json",
    }).then((data) => {
      dispatch(setToStore(app, "appId"));
      dispatch(setToStore(token, "token"));
      dispatch(setToStore(data.app_reports, "dataQueryPeriod"));
      dispatch(setToStore(data.totals[0], "dataQueryPeriodTotal"));
      dispatch(setToStore(data.app_reports[0].created_at, "startDate"));
      dispatch(setToStore(data.app_reports[data.app_reports.length-1].created_at, "endDate"));
    }).then(() => {
      dispatch(getPreviousMonthDates());
      dispatch(createChartJsData());
    }).then(() => {
      dispatch(getPreviousMonthData());
    });
  };
}

基本上，最终的调度无法按预期工作。我也认识到，从action_creators和另一个来自reducer的ajax调用进行一次ajax调用是非常不优雅的。我希望能让它工作一次然后重构。

Answer 1

根据guruPitka的建议，我放弃了reducer ajax调用并将其实现到action_creator，这创建了以下庞然大物：

export function getDataPointQuery(queryObj) {
  // variables and stuff

  return(dispatch) => {
    $.ajax({
      url: uri,
      method: "GET",
      dataType: "json"
    }).then((data) => {
      dispatch(setToStore(app, "appId"));
      dispatch(setToStore(token, "token"));
      dispatch(setToStore(data.app_reports, "dataQueryPeriod"));
      dispatch(setToStore(data.totals[0], "dataQueryPeriodTotal"));
      dispatch(getMonthDates());
    }).then(() => {
      dispatch(getPreviousMonthDates());
      dispatch(createChartJsData());
    }).then(() => {    
      $.ajax({
        url: previousUri,
        method: "GET",
        dataType: "json"
      }).then((result) => {
        console.log(result);
        dispatch(setToStore(result.app_reports, "previousMonth"));
        dispatch(setToStore(result.totals[0], "previousMonthTotal"));
      });
    });
  };
}

如何在ajax调用后设置为redux store？

1 个答案: