In React, Props means Properties.

Props are used to pass data from one component to another component.

Example

Child Component
function Student(props) {
 return <h1>Hello {props.name}</h1>;
}
export default Student;

Parent Component

import Student from './Student';
function App() {
 return (
   <div>
     <Student name="Mahendra" />
   </div>
 );
}
export default App;

Output:
Hello Mahendra


Props with Variables

function App() {
 const studentName = "Rahul";
 return (
   <Student name={studentName} />
 );
}

Props with Numbers

<Student marks={95} />


Props with Boolean

<Student isLogin={true} />

Props with Array

<Student subjects={["PHP", "React", "Node"]} />

Props with Object

<Student data={{name:"Mahendra", age:25}} />
function User(props) {
 return <h1>Hello {props.name}</h1>;
}
User.defaultProps = {
 name: "Guest"
};


1. What are Props in React?

Props are used to pass data from parent component to child component.

2. Are props mutable?

No, props are read-only.

3. What is the full form of Props?

Properties.

4. Can we pass functions in props?

Yes.