what is function component and class component in react JS code example
Example 1: function inside a class component react
export default class Archive extends React.Component {
saySomething(something) {
console.log(something);
}
handleClick(e) {
this.saySomething("element clicked");
}
componentDidMount() {
this.saySomething("component did mount");
}
render() {
return <button onClick={this.handleClick.bind(this)} value="Click me" />;
}
}
Example 2: class to functional component react
// convert a class component to a functional component
class MyComponent extends React.Component {
state: {
name: 'Bob'
}
render() {
return (
<p>Hello, my name is {this.state.name}</p>
);
}
}
const MyComponent = () => {
const [name, setName] = React.useState('Bob');
return (<p>Hello, my name is {name}</p>);
}