react项目搭建(自学记录)

本地下载react脚手架

npm install -g create-react-app

创建本地react项目demo01

create-react-app demo01

新建入口文件 index.js

import React from "react";
import ReactDom from "react-dom";
import App from "./app";
ReactDom.render(<App />, document.getElementById("root"));

新建app.js

//imr和ccc
//Fragment外层包裹标签且不影响dom  
import React, { Component } from "react";
class App extends Component {
  constructor(props) {
 super(props);
 this.state = {
   world: "hello world",
 };
  }
  render() {
 return (
   <Fragment>

     <div>111</div>
     <div>{this.state.world}</div>

   </Fragment>
)
  }
}
export default App;

react生命周期

  // react声明周期阶段
    // 1、Initialiazation: 初始化阶段

  // 2、Mounting: 挂载阶段

  // UNSAFE_componentWillMount

  // render

  // 	componentDidMount

  // 3、Updation: 更新阶段

  // 	1-shouldComponentUpdate---组件发生改变前执行

  // 2-componentWillUpdate---组件更新前，shouldComponentUpdate函数之后执行

  // 3-render----开始挂载渲染

  // 4-componentDidUpdate----组件更新之后执行

  // 4、Unmounting:销毁阶段

  // UNSAFE_componentWillUpdate;