ReactNative生命周期

作者: 遛遛食 | 来源:发表于2019-08-06 15:10 被阅读0次
    React Naive生命周期.png
    getDefaultProps
    • 用于初始化一些默认的属性,通常会将固定的内容放在这个函数中进行初始化和赋值
    • 在组件中,可以利用this.props获取在这里初始化它的属性,由于组件初始化后,再次使用该组件不会调用getDefaultProps函数,所以组件自己不可以修改props(即:props可认为是只读的),只可由其他组件调用它时在外部修改
    constructor(props) / getInitialState()
    • 该函数是用于对组件的一些状态进行初始化
    • 由于该函数不同于getDefaultProps,在以后的过程中,会再次调用,所以可以将控制控件的状态的一些变量放在这里初始化,如控件上显示的文字,可以通过this.state来获取值,通过this.setState来修改state值
    • 注意在新的RN中getInitialState()被constructor(props)替代了
    componentWillMount
    • 在组件将要被加载在视图上之前调用,功能相对较少
    render
    • render是一个组件中必须有的方法,返回JSX或其他组件来构成DOM
    • 注意:只能返回一个顶级元素
    • 在render函数中,只可通过this.state和this.props来访问在之前函数中初始化的数据值 。
    componentDidMount
    • 组件加载成功并被成功渲染出来以后,一般会在这个函数中处理网络请求等加载数据的操作和一些耗时操作可以放在此方法中

    存在期阶段函数功能分析
    • componentWillReceiveProps
      指父元素对组件的props或state进行了修改
    • shouldComponentUpdate
      一般用于优化,可以返回false或true来控制是否进行渲染
    • componentWillUpdate
      组件刷新前调用,类似componentWillMount
    • componentDidUpdate
      更新后的相关操作

    componentWillUnmount
    • 页面销毁方法,用于清理一些无用的内容和定时器

    相关文章

      网友评论

        本文标题:ReactNative生命周期

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