import React from "react";
import ReactDOM from "react-dom";
const todoList = ["张三", "李四", "王五", "孙六"];
class Todo extends React.Component {
  render() {
    return <li>您好, {this.props.content}</li>;
  }
}
class App extends React.Component {
  constructor(props) {// React 约定每个继承自 React.Component 的组件在定义 constructor 方法时，要在方法内首行加入 super(props) 
    super(props);
    this.state = {
      todoList: []
    };//初始化
  }
  componentDidMount() {//挂载state
    this.timer = setTimeout(() => {//设置计时器，这个硬性记忆吧，记不住回来照着笔记打
      this.setState({
        todoList: todoList//this.setState更新state
      });
    }, 2000);//2秒后生效
  }
  componentWillUnmount() {
    clearTimeout(this.timer);//计时器超时后卸载states生命周期
  }
  render() {//渲染输出
    return (
      <ul>
        <Todo content={this.state.todoList[0]} />
        <Todo content={this.state.todoList[1]} />
        <Todo content={this.state.todoList[2]} />
        <Todo content={this.state.todoList[3]} />
      </ul>
    );
  }
}
ReactDOM.render(<App />, document.getElementById("root"));