• react生命周期


    图是百度来的 图有一处错误componentWillReceiveProps图上是错的

     1 componentWillMount:在组件渲染之前执行
    2 componentDidMount:在组件渲染之后执行
    3 shouldComponentUpdate :返回true和false,true代表允许改变,false表示不允许
    4 componentWillUpdate:数据改变之前执行
    5 componentDidUpdate:数据修改完成

    componentWillReveiceProps props变化时
    componentWillUnmount :组件卸载前执行
    说道生命周期那就说个典型的父传子,子传父

    //
    <StateComponent title={this.state.aa}/> 
    
    //
    render() { 
            const {count}=this.state;
            return ( 
                <div>
                    <h3>生命周期函数</h3>
                    <p>{count}--{this.props.title}</p>
                </div>
            );
        }
    //子传父
    //
    render(){
        return(
          <div>
            <StateComponent title={this.state.aa} changeTitles={this.changeTitle}/> //父组件把方法传到子组件里面
          </div>
        )
      }
      changeTitle=(data)=>{
        this.setState({
          aa:data
        })
      }
    //
    render() { 
       const {count}=this.state;
       return ( 
                <div>
                    <h3>生命周期函数</h3>
                    <p>{count}--{this.props.title}</p>
                    <button onClick={this.changeTitle}>修改</button>
                </div>
       );
    }
    changeTitle=()=>{
       this.props.changeTitles("子组件传参");//子传父,子调用父级的方法
    }
  • 相关阅读:
    Hdu 5595 GTW likes math
    HNOI2002 营业额统计(Splay Tree)
    hdu 5592 BestCoder Round #65(树状数组)
    hdu 5591 BestCoder Round #65(博弈)
    hdu5586 BestCoder Round #64 (div.2)
    NoSQL
    什么是关系型数据库
    关系型数据库与NOSQL
    关系型数据库
    centos6.x下安装eclipse
  • 原文地址:https://www.cnblogs.com/zhihou/p/12953508.html
Copyright © 2020-2023  润新知