Function:
Passing the data to the components.
Situation 1:
access data to class components.
Situation 2:
access data to functional components.
//App.js
import logo from './logo.svg';import './App.css';import { Component } from 'react';class Body extends Component{ //S1render(){return(<aclassName="App-link"href="https://reactjs.org"target="_blank"rel="noopener noreferrer">{this.props.note}</a>)}}const Header = props=>( //S2<p> {props.title} </p>)function App() {return (<div className="App"><header className="App-header"><img src={logo} className="App-logo" alt="logo" /><Header title="Hello"/><p>Edit <code>src/App.js</code> and save to reload.</p><Body note={"Learn React"}></Body></header></div>);}export default App;