Props in React is argument passed to React component through HTML Attribute. either String as argument or varibale or object to React Component an attribute is used in HTML to pass to React Component is Called Props in React
Example
class Name extends React.Component {
render() {
return <h2>my name is {this.props.name}!</h2>;
}
}
ReactDOM.render(<Name name="yashpal" />, document.getElementById('root'));
How to pass variable in React Props ?
to pass variable as an argument for React Props just use curly bracket for variable Props
Example
ReactDOM.render(<Name name={variable name} />, document.getElementById('root'));
How to object in React Props ?
to pass object in React Props just use curly braket and pass object in HTML attribute
Example:
const fullname = {name: "yashpal", model: "singh"};
ReactDOM.render(<Name name={fullname} />, document.getElementById('root'));
How to use Props in Constructor ?
in class Constructor props has to be pass to super() as argument
Sysntax
class Name extends React.Component {
constructor(props) {
super(props);
}
render() {
return <h2>my name is {this.props.name} </h2>;
}
}
ReactDOM.render(<Name name="yashpal"/>, document.getElementById('root'));