实施例

Question

我正在尝试使用redux-thunk链接调度。我有2个动作创建者，如下所示：

getResourceLinks ：

JCombobox

和 loadAppliances ：

- (void)viewDidLoad {

    [super viewDidLoad];
    [self configureView];

    // create three funky nav bar buttons
    UIBarButtonItem *one = [[UIBarButtonItem alloc]initWithTitle:@"One" style:UIBarButtonItemStylePlain target:self action:@selector(testMethod)];
    UIBarButtonItem *two = [[UIBarButtonItem alloc]initWithTitle:@"Two" style:UIBarButtonItemStylePlain target:self action:@selector(testMethod)];
    UIBarButtonItem *three = [[UIBarButtonItem alloc]initWithTitle:@"Three" style:UIBarButtonItemStylePlain target:self action:@selector(testMethod)];

    // create a spacer
    UIBarButtonItem *space = [[UIBarButtonItem alloc]initWithBarButtonSystemItem:UIBarButtonSystemItemFixedSpace target:self action:nil];
    space.width = 30;

    NSArray *buttons = @[one, space, two, space, three];

    self.navigationItem.rightBarButtonItems = buttons;
}

我在 loadAppliances 操作的第3行遇到错误：export const getResourceLinks = () => { return dispatch => { let req = { url: getRootUrl(), header: { Accept: 'application/json' } }; return request(req).then(res => { dispatch({ type: ActionTypes.RESOURCE.LOAD_URL_SUCCESS, payload: res.body }); }).catch(err => { dispatch({ type: ActionTypes.RESOURCE.LOAD_URL_ERROR, payload: err }); }); } };。承诺得到了正确的回报，不是吗？我做错了什么吗？我仔细看过thunk-redux的例子，但我仍然没有发现错误。

更新即可。请求：

export const loadAppliances = () => {
  return (dispatch, getState) => {
    return dispatch(getResourceLinks()).then(res => {
      const {resources} = getState();
      let req = {
        url: getResourceLink(Resources.Appliances, res.body),
        header: {
          Accept: 'application/json'
        }
      };
      request(req).then(res1 => {
        dispatch({
          type: ActionTypes.APPLIANCE.LOAD_SUCCESS,
          payload: res1.body
        });
      }).catch(err => {
        dispatch({
          type: ActionTypes.APPLIANCE.LOAD_ERROR,
          payload: err
        });
      });
    });
  };
};

Answer 1

这里的问题是dispatch不会回复你的承诺。它实际上返回调度的动作本身。（reference）。

return dispatch(getResourceLinks()).then(res => {
                                   ^--- this is the problem

我接近这个的方法是在你第一次成功通话后发出一个动作并在状态中存储任何相关信息，然后发出下一个电话并存储它的响应。

实施例

const getResourceLinks = () => {
  return request({
    url: getRootUrl(),
    header: {
      Accept: 'application/json'
    }
  });
};

const getAppliances = (appliances) => {
  return request({
    url: getResourceLink(Resources.Appliances, appliances),
    header: {
      Accept: 'application/json'
    }
  })
};

export const loadAppliances = () => {
  return (dispatch, getState) => {
    getResourceLinks()
      .then(res => {
        dispatch({
          type: ActionTypes.RESOURCE.LOAD_URL_SUCCESS,
          payload: res.body
        });

        return getAppliances(res.body)
          .then(res1 => {
            dispatch({
              type: ActionTypes.APPLIANCE.LOAD_SUCCESS,
              payload: res1.body
            });
          })
          .catch(err => {
            dispatch({
              type: ActionTypes.APPLIANCE.LOAD_ERROR,
              payload: err
            });
          });
      })
      .catch(err => {
        dispatch({
          type: ActionTypes.RESOURCE.LOAD_URL_ERROR,
          payload: err
        });
      });
  }
}

您还可以查看redux-saga

具有承诺的Redux-thunk不起作用

1 个答案:

实施例