Props in React
Introduction
props are used to pass data and methods from a parent component to a child component.
Interesting things about props
1. They are immutable.
2. They allow us to create reusable components.
Basic example
class Parent extends React.Component{
doSomething(){
console.log("Parent component");
}
render() {
return <div>
<Child
text="This is the child number 1"
title="Title 1"
onClick={this.doSomething} />
<Child
text="This is the child number 2"
title="Title 2"
onClick={this.doSomething} />
</div>
}
}
class Child extends React.Component{
render() {
return <div>
<h1>{this.props.title}</h1>
<h2>{this.props.text}</h2>
</div>
}
}As you can see in the example, thanks to props we can create reusable components.