master

分支 (1)

管理

管理

master

1711AReact
/
demo10.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <!-- 引入的时候要注意引入顺序，讲按下面的顺序引入 -->
    <script src="lib/react.js"></script>
    <script src="lib/react-dom.js"></script>
    <script src="lib/browser.js"></script>
</head>

<body>
    <div id="root"></div>
    <script type="text/babel">
    class App extends React.Component{
      constructor(props){
             super(props)
             this.state={
                  loading:true
             }
             //不能直接修改state里面的值

       }
       componentDidMount(){
 setTimeout(()=>{
     this.setState({
         loading:false
     })
 },3000)
       }
      render(){
        if(this.state.loading){
            return <h1>正在加载........</h1>
        }else{
            return <div> <h1>数据列表</h1>  </div>
        }

      }
    }
    ReactDOM.render(
        <App/>,document.getElementById("root")
    )

    </script>

</body>

</html>