redux-form/redux-form v0.6.0 on GitHub

⚠️ BREAKING CHANGE ⚠️

☑️ Reworked structure of state in Redux store and of how field data is passed into the decorated component. See Migration Guide below for details.
☑️ [non-breaking] Added a new way to normalize your data as it is being entered. See Normalizing Form Data.

Migration Guide

State

In v0.5.0, the state for each form looked like:

{
  asyncErrors: {
    name: 'We already have a user with that name'
  }
  asyncValidating: false,
  data: {
    name: 'Bobby Tables',
    age: '17',
    height: '175'
  },
  submitting: false,
  touched: {
    name: true,
    age: true,
    height: false
  }
}

In v0.6.0, the state for each form looks like:

{
  _asyncValidating: false,
  _submitting: false,
  name: {
    value: 'Bobby Tables',
    touched: true,
    asyncError: 'We already have a user with that name'
  },
  age: {
    value: '17',
    touched: true,
  },
  height: {
    value: '175',
    touched: false
  }
}

Props

The data, errors, and touched props have all gone away. The information they contained is now in fields.

For your field called name, the following prop migration needs to happen:

`v0.5.0`	`v0.6.0`
`this.props.data.name`	`this.props.fields.name.value`
`this.props.errors.name`	`this.props.fields.name.error`
`this.props.touched.name`	`this.props.fields.name.touched`
`this.props.handleBlur('name')`	`this.props.fields.name.handleBlur`
`this.props.handleChange('name')`	`this.props.fields.name.handleChange`
`this.props.isDirty('name')`	`this.props.fields.name.dirty`
`this.props.isPristine('name')`	`this.props.fields.name.pristine`
😢	`this.props.fields.name.valid`
😢	`this.props.fields.name.invalid`

Destructuring Props

The brilliant part of this, is that handleBlur and handleChange have onBlur and onChange aliases, so you can do this:

const { fields: {name} } = this.props;
...
<input type="text" {...name}/>     // will pass value, onBlur and onChange

Nice, huh?