Props (short for “properties”) in ReactJS are like a way to pass data from one component to another. Imagine you’re building a website, and you want to share information (like text, numbers, or actions) between different parts of the page. Props make this possible!
Here’s how props work:
1️⃣ Send Data: You pass props from a parent component to a child component like passing arguments to a function.
2️⃣ Receive Data: The child component receives the props and can use them to display or handle information.
Example:
Let’s say you have a Greeting component:
function Greeting(props) {
return <h1>Hello, {props.name}!</h1>;
}
Now, when using the Greeting component:
<Greeting name="DevUnwind" />
This will display:
Hello, DevUnwind!
Key Points to Remember:
- Props are read-only, meaning they cannot be changed by the child component.
- You can pass anything as a prop: strings, numbers, functions, or even other components.
Think of props as a way to make your components flexible and reusable!
Leave a Reply