抛出redux-form的SubmissionError会导致Uncaught(在promise中)

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

我提前为格式化做了道歉(这仍然是一个新的),也许是对于这个愚蠢的问题(在整个React生态系统中仍然是一个新的)。

我最近选择了redux-form,从那以后我一直试图以下列方式使用它:

export const searchPermissions = () => {
  return dispatch => {
    Axios.get(`${URL}/findPermissions`)
      .then(resp => {
        console.log(resp.data);
        dispatch({ type: PERMISSIONS_SEARCHED, payload: resp.data });
      })
      .catch(error => {
        console.log(error);
        throw new SubmissionError({
          _error: "Submission error!"
        });
      });
  };
};

而且我一直收到未捕获的错误。

通过redux-form的github搜索,我看到几个类似的问题最终通过添加return语句(我认为我做得正确)来解决,现在我有点迷失了。

在此先感谢您的帮助。

编辑:我正在尝试获取权限,以便在用户进入页面后立即在3个组合框中显示它们。在用于获取数据的组件中,我有以下代码:

  componentWillMount() {
    this.props.searchPermissions();
  }
  render() {
    return (
      <div>
        <LayoutGroupForm
          onSubmit={this.props.addLayoutGroup}
          loadPermissions={this.props.loadPermissions}
          visualizationPermissions={this.props.visualizationPermissions}
          detailPermissions={this.props.detailPermissions}
          resetForm={this.props.resetForm}
        />
      </div>
    );
  }
}
const mapStateToProps = state => ({
  loadPermissions: state.layoutGroup.loadPermissions,
  visualizationPermissions: state.layoutGroup.visualizationPermissions,
  detailPermissions: state.layoutGroup.detailPermissions
});
const mapDispatchToProps = dispatch =>
  bindActionCreators(
    {
      searchPermissions,
      addLayoutGroup,
      resetForm
    },
    dispatch
  );

在我的减速机上,我有以下几点:

    case PERMISSIONS_SEARCHED:
      return {
        ...state,
        loadPermissions: action.payload.loadPermissions,
        visualizationPermissions: action.payload.visualizationPermissions,
        detailPermissions: action.payload.detailPermissions
      };
javascript reactjs redux redux-form
1个回答
1
投票

Redux Form期望错误成为被拒绝的承诺中的错误。试试这个:

export const searchPermissions = () => {
  return dispatch => {
    return Axios.get(`${URL}/findPermissions`)
//  ^^^^^^-------------------------------------- Actually return the promise!
      .then(resp => {
        console.log(resp.data);
        dispatch({ type: PERMISSIONS_SEARCHED, payload: resp.data });
      })
      .catch(error => {
        console.log(error);
        return Promise.reject(new SubmissionError({
//      ^^^^^^^^^^^^^^^^^^^^^^------------------------ Return rejected promise
          _error: "Submission error!"
        }));
      });
  };
};
© www.soinside.com 2019 - 2024. All rights reserved.