How to pass data from child component to its parent in ReactJS ?
In ReactJS, data flow between components is typically unidirectional, meaning data is passed from parent components to child components. However, there are scenarios where you may need to pass data from a child component back to its parent component. In this article, we will explore how to achieve this in ReactJS.
Following are the steps to pass data from the child component to the parent component:
- In the parent component, create a callback function. This callback function will retrieve the data from the child component.
- Pass the callback function to the child as a props from the parent component.
- The child component calls the parent callback function using props and passes the data to the parent component.
Creating React Application:
Step 1: Create a React application using the following command:
npx create-react-app foldername
Step 2: After creating your project folder i.e. foldername, move to it using the following command:
Project Structure: It will look like the following.
My Personal Notes arrow_drop_up
Please Login to comment...