In this example, you are going to create a simple parent and child element combination that passes some simple data back from the child element through a function parameter.
- Make a simple child element first with a input element with the onChange property to update a localized state variable to its current value.
- This is the barebones element, and needs to have the functionality of passing back to its parent element. Below our additions to the element including adding a new button to "Send Data" to its parent with the onClick pointing to a local function that calls a function that is now passed into this child element.
- Next step is to make the parent element which uses a simple state variable to hold the data returned, and a local function that is called from the child. The data that is being returned from the child function is passing upwards to its 'handler' - handleDataFromChild() and then being set inside our local state variable. This data is now accessible throughout this parent element.
Thank you so much for taking the time to read, and dont forgot to follow along my learning journey here on dev.to, and comment anything new I should be looking into with the React world!
Top comments (0)