~~~
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Hello React!</title>
<script src="https://cdn.staticfile.org/react/16.4.0/umd/react.development.js"></script>
<script src="https://cdn.staticfile.org/react-dom/16.4.0/umd/react-dom.development.js"></script>
<script src="https://cdn.staticfile.org/babel-standalone/6.26.0/babel.min.js"></script>
</head>
<body>
<div id="example"></div>
<script type="text/babel">
class Hello extends React.Component{
constructor(props){
super(props);
this.state = {
msg:"change"
}
}
render(){
return (<div onClick={this.handleClick}>{this.state.msg}</div>)
}
handleClick=()=>{
this.setState({
msg:"nihao"
})
}
componentDidMount(){
console.log(1)
}
}
ReactDOM.render(
<Hello/>,
document.getElementById('example')
);
</script>
</body>
</html>
~~~