- Redux Form
- FAQ
- Will
redux-form
work with a my custom input component?
Will redux-form
work with my custom input component?
The minimum interface needed for a custom component to work with redux-form
is to make sure that
value
and onChange
are passed properly. These are pretty standard prop names, so it's
possible that your component will work right out of the box.
But let's say that you have a custom component called MyStrangeInput
that has currentValue
and thingsChanged
props that expect the value to be wrapped in an object under a val
key. You
would have to do something like:
const renderMyStrangeInput = field => (
<MyStrangeInput
currentValue={{val: field.input.value}}
thingsChanged={param => field.input.onChange(param.val)}/>
)
...
render() {
return (
<div>
<Field name="myField" component={renderMyStrangeInput}/>
</div>
);
}
The point is that almost any input can be adjusted to use redux-form
. If you are using an input
component with a non-standard interface many times in your application, it is recommended that
you wrap it in another component that will allow you to do the normal field destructuring:
<AdaptedInput {...props}/>
.