React 代码demo

代码范例1 index.js：

importReactfrom'react'; importReactDOMfrom'react-dom';   functionClock(props){ return( <div> <h1>现在的时间是{props.date.toLocaleTimeString()}</h1> <h2>这是副标题</h2> </div>   ) }   functionrun(){ ReactDOM.render( <Clockdate={newDate()}/>,document.querySelector('#root') ) }   setInterval(run,1000);

 

 

 

代码范例2  Index.html:

importReactfrom'react'; importReactDOMfrom'react-dom'; import'./App.css'   letstr="现在的时间是："; lettime=newDate().toLocaleTimeString();   letelement=( <div> <h1>helloworld</h1> <h2>{str+time}</h2> </div> )   letman="不发热"; letelement2=( <div> <h1>今天是否需要隔离：</h1> <h2>{man==="发热"?"隔离":"不隔离"}</h2> </div> )   letelement4=( <div> <span>横着趟</span> <span>竖着躺</span> </div> ) letelement3=( <div> <h1>今天是否需要隔离：</h1> <h2>{man==="发热"?<button>隔离</button>:element4}</h2> </div> )   letcolor='bgRed'; letlogo='https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png';   letelement5=( <divclassName={color}> <imgsrc={logo}></img> 红色的背景颜色 </div> )   letroot=document.querySelector("#root");   ReactDOM.render(element5,root);