v6.0.0-rc.4
Pre-releaseI really wanted to release v6.0.0
in July, especially since Redux Form's birthday was July 31, one year after the initial commit on July 31, 2015. 🎂🎉
However, some new features and breaking changes appeared, and I'd feel more comfortable if they were released for a week as an RC to ensure a lack of bugs before pulling the trigger on the release.
Bug Fixes
- Fixed drag and drop bug in IE. #1373 #1088
- Removed
Array.findIndex()
polyfill. #1412 #1326 (IE again 😡) - Fixed quirky bug when reading values from events. #1369 #1355
- Added missing array action creators to the
propTypes
list.
Features
- Added
parse
andformat
props toField
, giving much more control to how values are transformed when transported between the Redux Store and the input. #1412 This was always a feature that had been planned forv6
. See:Field
and Value Lifecycle - Added a set of selectors for reading form state from any
connect()
ed component. See: Selectors
⚠ Breaking Change ⚠
It came to my attention that my initial attempt at resolving the React v15.2.0
prop warning problem in v6.0.0-rc.2
was horribly flawed. A poll was conducted on #1425, and a relatively clear winner (not one of my ideas - 🍻 @kristian-puccio) was chosen. Please read that ticket for all the details, but I will summarize here.
The Field
component is in charge of passing three types of props to its component:
input
props - Props meant specifically for the input element, likevalue
,onBlur
, etc.meta
props - Metadata about your field that Redux Form is providing, likeerror
,dirty
, etc.custom
props - Any other props that you have given toField
The solution wrongheadedly decided in v6.0.0-rc.2
was to pass them to the component in the following structure:
{
input: {
...input,
...custom,
},
...meta
}
...such that any additional props that you passed would be lumped in with the ones that redux-form
provides for your input. This was dumb.
Now, they are passed as such:
{
input,
meta,
...custom
}
The two sets of special props that redux-form
provides you are encapsulated in input
and meta
objects, and all the additional props that you pass will be in the root. So a typical renderField
component might look a little something like this, with ES6 inline parameter destructuring:
const renderField = ({ input, label, type, meta: { touched, error } }) => (
<div>
<label>{label}</label>
<div>
<input {...input} placeholder={label} type={type}/>
{touched && error && <span>{error}</span>}
</div>
</div>
)
...
<Field name="username" type="text" component={renderField} label="Username"/>
Conclusion
I do not foresee any future breaking changes between now and release. As always, feedback is extremely welcome.