Zach Zach - 1 year ago 92
React JSX Question

How can I pass a prop down through all subcomponents without doing so explicitly?

I am using redux with react to manage the state of a complex form, which will be a single object. My form will have nested data structures which the user may edit, so for example : Applicant.Address.Country would be updated by a textbox on my form. I had the idea of making an action called UPDATE_MODEL where updates could be made by passing in objects like :

{Applicant: {Address: {Country: 'France'} } }


Which would get merged with the state by the reducer. The dispatch to update the model would need to be passed down to every single form field, as well as a prop for telling the component where it fits in the entire tree of the form. Do I have any alternatives to not passing down these two props throughout the form? It just sounds messy.

Answer Source

Yes, you do. You can use React context.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download