Like other component frameworks, React supports parent-child component interaction by using props. Every component in React has an accessible props property, which is a key-value object containing all the data passed in from the parent component.
Consider the following example:
import React from 'react'; class Child extends React.Component { render() { return ( <span>Hello {this.props.greet}</span> ); }} export default Child;
The Child component is a simple component that renders a span element with some greeting text. Importantly, it uses the props object while rendering, meaning it expects a text property to be passed down from the parent. To pass down expected props, a parent component simply needs to specify those as simple HTML-like ...