Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Throwing a SubmissionError of redux-form causes Uncaught (in promise)

I apologize in advance for the formatting (still a newb on this), and maybe for the stupid question (still a newb on this whole React ecosystem).

I've recently picked up redux-form, and since then I've been trying to use it in the following way:

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!"
        });
      });
  };
};

And I keep getting the Uncaught error.

Searching through redux-form's github, I saw several similar problems that ended up being solved by adding the return statement (which I think I did correctly) and now I'm kinda lost.

Thanks in advance for any help.

EDIT: I'm trying to fetch the permissions to display them in 3 combo boxes as soon as the user enters the page. In the component used to fetch the data I have the following code:

  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
  );

And on my reducer I have the following:

    case PERMISSIONS_SEARCHED:
      return {
        ...state,
        loadPermissions: action.payload.loadPermissions,
        visualizationPermissions: action.payload.visualizationPermissions,
        detailPermissions: action.payload.detailPermissions
      };
like image 419
Victor Avatar asked Dec 15 '17 13:12

Victor


1 Answers

For those of you who still encounter this issue (like me), the solution is to add return to your submit handler. Read more here https://github.com/erikras/redux-form/issues/2269

like image 56
Sahar Avatar answered Oct 03 '22 01:10

Sahar