example react functional component
Example 1: create react component class
class MyComponent extends React.Component{
constructor(props){
super(props);
};
render(){
return(
<div>
<h1>
My First React Component!
</h1>
</div>
);
}
};
Example 2: create functional component react
import React from 'react'; const App = () => { const greeting = 'Hello Function Component!'; return <Headline value={greeting} />;}; const Headline = ({ value }) => <h1>{value}</h1>; export default App;
Example 3: functional components react
function Comment(props) {
return (
<div className="Comment">
<div className="UserInfo">
<img className="Avatar"
src={props.author.avatarUrl}
alt={props.author.name}
/>
<div className="UserInfo-name">
{props.author.name}
</div>
</div>
<div className="Comment-text">
{props.text}
</div>
<div className="Comment-date">
{formatDate(props.date)}
</div>
</div>
);
}
Example 4: create-react-app class component
npx create-react-app my-app --scripts-version react-scripts@2.1.7