Props and the state are the input data for rendering the component. Both props and the state are actually JavaScript objects, and the component is re-rendered when the props or the state change.
The props are immutable, so the component cannot change its props. The props are received from the parent component. The component can access the props through the this.props object. For example, let's take a look at the following component:
class Hello extends React.Component {
render() {
return <h1>Hello World {this.props.user}</h1>;
}
}
The parent component can send props to the Hello component in the following way:
<Hello user="John" />
When the Hello component is rendered, it shows the Hello World John text.
The state can be changed inside the component. The initial value of the state is given in the component's constructor...