zoukankan      html  css  js  c++  java
  • 标准的ES6语法的react组件生命周期代码

    //ES6语法定义的组件生命周期
    import React,{Component} from 'react';
    export  default class Life extends Component{
        constructor(props){
            super(props)
            console.log('构造函数')
            //初始化了我们的state,这是被推荐的语法
            this.state={
                props1:"初始化state"
            }
        }
      //组件将要被渲染到真实的dom节点中
      componentWillMount(){
          console.log('componentWillMount');
      }
      //组件已经插入到真实的dom节点中
      componentDidMount(){
          console.log('componentDidMount');
      }
      //组件是否要被重新渲染
      shouldComponentUpdate(){
          console.log('shouldComponentUpdate');
          return true;
      }
      //组件将要被重新渲染
      componentWillUpdate(){
          console.log('componentWillUpdate');
      }
       //组件已经被重新渲染
       componentDidUpdate(){
           console.log('componentDidUpdate');
       }
      //组件将要接收到新属性
      componnentWillReceiveProps(){
          console.log('componnentWillReceiveProps');
      }
      click1=()=>{
          console.log('点击了单击事件');
          this.setState({
              props1:'改变了state的值'
          })
          console.log('点击了单击事件结束');
      }
      render(){
          console.log('render');
          return(
              <div>
                  <h1 onClick={this.click1}>{this.state.props1}</h1>
              </div>
              )
      } 
    }
  • 相关阅读:
    hadoop集群配置和测试
    ubuntu 12.04安装jdk
    springboot集成mybatis
    redis连接数据库
    生产随机数
    关于字符串统计次数
    闲的无聊写了一个房租的后台
    简单的死锁
    java集合类总结(转)
    mybatis框架的搭建
  • 原文地址:https://www.cnblogs.com/luxiaoxiao/p/6439661.html
Copyright © 2011-2022 走看看