React follows single source of truth but what if we want to write a method inside an object model that requires access to a property that only exists in a different model! How can we give this model access to the other model’s properties? This is where
props takes a major part.
Props — it allows us to pass values into our components,
Props cannot be changed and you cannot directly modify a property of a component. Props are inherited from another parent component to its child component.
State — But when we need to change our object we take the help of React state. To use state it has to be class-based components. State use this.setState to change the object by using a function. We usually assign it to an event handler (onClick, onSubmit, etc)
In conclusion, props are read-only, can’t be modified other hand state changes async.