美文网首页
五(2)、React之类组件 ------ 2019-11-01

五(2)、React之类组件 ------ 2019-11-01

作者: 自己写了自己看 | 来源:发表于2020-03-21 19:09 被阅读0次

    1、类组件

    /**
     * 类组件:
     * 创建一个类,让其继承React.Component或者React.PureComponent
     * 此类被称为类组件
     *
     * 特点:
     * (1)类组件又称为动态组件;
     */
    
    import React from "react";
    
    export default class Clock extends React.Component {
      // 调取组件,创建类的一个实例,首先执行 constructor,
      // 把属性、上下文等信息传递进来
      constructor(props) {
        super();
        // 定义初始状态 
        this.state = {
          time: new Date().toLocaleString()
        };
      }
      render() {
        return <div>{this.state.time}</div>;
      }
      componentDidMount() {
        setInterval(() => {
          this.setState({
            time: new Date().toLocaleString()
          });
        }, 1000);
      }
    }
    

    2、类组件的状态管理:

    /**
     * React中基于状态来管理动态组件(类组件):
     * (1)设置初始状态值;
     * (2)修改状态:setState修改组件状态及重新渲染;
     * (3)setState接收两个值作为参数:{要修改的值}、回调函数
     */
    

    相关文章

      网友评论

          本文标题:五(2)、React之类组件 ------ 2019-11-01

          本文链接:https://www.haomeiwen.com/subject/ewufbctx.html