Class Component
[classcomponent], [reactjs], [reactjscomponent]
// ./src/CatDescription.tsx
import React from 'reat';
interface IProps{
likeBy?: number
}
interface IState{
like: number;
}
class CatDescription extends React.Component<IProps, IState>{
public static defaultProps: Partial<IProps> = {
likeBy: 1,
};
public state: IState = {
like: 0
};
public increase = () => {
const likeBy: number = this.props.likeBy!;
const like = this.state.like + likeBy;
this.setState({ like });
};
public render(): React.ReactNode{
return (
<div>
<p> Hello ... it's me.</p>
<img src="https://i.imgur.com/igdestH.gif" alt="cat image" />
<button onClick={this.increase}> Likes: {this.state.like}</button>
</div>
);
}
}
export default CatDescription;