极客观点
项目管理
HarmonyOS
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="https://cdn.bootcss.com/react/15.4.2/react.min.js"></script>
<script src="https://cdn.bootcss.com/react/15.4.2/react-dom.min.js"></script>
<script src="https://cdn.bootcss.com/babel-standalone/6.22.1/babel.min.js"></script>
<style media="screen">
.box {width:200px;height:300px;background:#CCC}
</style>
<script type="text/babel">
class ShowHide extends React.Component{
constructor(...args){
super(...args);
this.state={display:'block',backgroundColor:"red"};
}
fn(){
this.setState({
display: this.state.display=='block'?'none':'block'
backgroundColor:this.state.backgroundColor=='red'?'blue':'red'
});
}
render(){
return <div>
<input type="button" value="显示隐藏" onClick={this.fn.bind(this)} />
<div className="box" style={{display: this.state.display}}></div>
</div>;
}
}
window.onload=function (){
var oDiv=document.getElementById('div1');
ReactDOM.render(
<ShowHide/>,
oDiv
);
};
</script></head>
<body>
<div id="div1">
</div></body>
</html>
两个地方:
少了个逗号
背景色:
背景色变蓝了.要在f12里面看