CODEWITHSUNDEEP
javascriptreactjsreduxredux-form
Akash Salunkhe
Akash Salunkhe

Reputation: 314

Redux-form async validation, avoid using "throw"

So i am using redux-form and following the example for async validation in documentation, everything is working fine but i want to avoid using throw to throw object like below

throw {email:"Already exists"}

I have tried using "SubmissionError" but when i throw SubmissionError, it adds and object called "errors" inside "asyncErrors" in redux and then errors are not displayed below field, they are displyed if i just throw it like this throw {email:"Already exists"} Below is my code using SubmissionError

import { SubmissionError } from 'redux-form/immutable';
import { doesUserExist } from '../../shared/endpoints/userEndpoint';

const asyncValidate = (values /*, dispatch */) => {
  return doesUserExist(values.get('email')).then((res) => {
    if (res.registered) {
      throw new SubmissionError({ email: 'This email is already in use.' });
    }
  });
};

export default asyncValidate;

output redux state is -

form: {
registerForm:{
 asyncErrors:{
  errors:{email: "This email is already in use."}
  }
 }
}

Upvotes: 1

Views: 324

Answers (1)

theWellHopeErr
theWellHopeErr

Reputation: 1872

The SubmissionError in redux forms will add general errors in asyncErrors object as it is given in the docs.

If it is rejected with a redux-form SubmissionError containing errors in the form { field1: 'error', field2: 'error' } then the submission errors will be added to each field (to the error prop) just like async validation errors are.

Refer here

Upvotes: 2

Related Questions