Grsmto Grsmto - 1 year ago 179
React JSX Question

Redux-form 6.0.0 access error outside Field component

In Redux-form v5 I was able to access to the "inline" errors (async validation) from anywhere in the decorated form, like so:

const fields = [

// inside the decorated form
const { email } = this.props.fields

console.log(email.error) // 'the validation error of the 'email' field

How can I achieve the same thing using Redux-form 6.0.0+ ?

Answer Source

If you are wanting to display the error next to the input, then it should be handled in the component that you pass to Field. If you want to display all the errors together, like at the bottom of the form by the submit button, you could use the new Fields component like so:

const fieldNames = [

const renderAllErrors = fields => (
    {Object.keys(fields).map(key => {
      const { meta: { touched, error } } = fields[ key ]
      return touched && error ? <li key={key}>{key}: {error}</li> : undefined


<Fields names={fieldNames} component={renderAllErrors}/>
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download