<div id="app"></div>
class App extends React.Component {
constructor(props) {
super(props);
this.state = {
count: 0,
};
this.handleClick = this.handleClick.bind(this);
}
sayHi() {
window.alert('Hello Ray.');
}
handleClick() {
this.setState((prevState) => ({
count: prevState.count += 1,
}));
}
render() {
return (
<div>
<button onClick={this.handleClick}>
Count is: { this.state.count }
</button>
<hr />
<button type="button" onClick={ this.sayHi }>打招呼</button>
</div>
);
}
}
const app = ReactDOM.createRoot(document.getElementById('app'));
app.render(<App />);
View Compiled
This Pen doesn't use any external CSS resources.