如何基于AJAX调用设置Redux Reducer的初始状态？

Question

使用Redux，我希望我的reducer的初始状态之一基于AJAX调用。 基本上，我使用AJAX来获取一些数据，然后将其置于Reducer的状态。 但是，由于进行了AJAX调用，在完成AJAX调用之前，将reducer初始化为初始状态。 在设置初始状态之前，如何使reducer等待AJAX​​调用完成？

商店

export default () => {
  const store = createStore(
    combineReducers({
      settings: settingsReducer,
    })
  );
  return store;
}

减速器

var settingsDefaultState;

$.ajax({
  url: 'view/content/settings.xml',
  type: 'GET',
  success: function(xml) {
    //DOING SOME STUFF WITH THE XML FILE HERE
    settingsDefaultState = {
      test: "HELLO WORLD"
    }
  },
  complete: function() {
    console.log("Settings Loaded...");
  }
});


export default (state, action) => {
  var tempState = {...state};
  switch (action.type) {
    default:
      return tempState;
  }
}

Answer 1

我建议您将状态初始化为loading状态。 这样，您可以将发生的事情反馈给用户。 然后，当ajax调用返回响应时，您将触发将状态设置为所需的下一个状态的操作。