<div id="root">
<!-- This element's contents will be replaced with your component. -->
</div>
const {useState} = React
function Welcome(props) {
const [sayHiTimes, setSayHiTimes] = useState(1);
return (
<div>
<h1>
Hi, 我是 {props.name},Say Hi {sayHiTimes} 次
</h1>
<input type="button" value="Say Hi!" onClick={()=> {
setSayHiTimes(sayHiTimes+1)
console.log(sayHiTimes)
}} />
</div>
);
}
const root = ReactDOM.createRoot(document.getElementById('root'));
const element = <Welcome name="Hobby"></Welcome>;
root.render(element);
View Compiled
This Pen doesn't use any external CSS resources.