Search code examples
react-redux-form

What is mapProps and controlProps in <Control> in react-redux-form?

I've been banging my head trying to figure out what mapProps and controlProps is in the react element in react-redux-form library.

I'm reading the documentation here but I can't figure out what it means or where it's use cases would be. 

<Control
     mapProps={\{
     customChange: (props) => props.change,
     }} 
     model="..."
/>

<Control.text
  model="..."
  component={CustomInput}
  controlProps={\{errors: 'errors for CustomInput'}}
/>

Could someone please explain it in simple English?

Thank you in advance!

Solution

  • mapProps is used when the control has a component props defined - i.e. is wrapping a custom component. Normally it would just pass on its props to the custom component, assuming it will use the same props names. But if say the custom component uses a different naming convention then this is a way to map the Control prop name to the custom component prop name.