React Native 中组件的生命周期
http://www.race604.com/react-native-component-lifecycle/
概述就像 Android 开发中的 View 一样,React Native(RN) 中的组件也有生命周期(Lifecycle)。所谓生命周期,就是一个对象从开始生成到最后消亡所经历的状态,理解生命周期,是合理开发的关键。RN 组件的生命周期整理如下图: 如图,可以把组件生命周期大致分为三个阶段:
生命周期回调函数下面来详细介绍生命周期中的各回调函数。 getDefaultProps在组件创建之前,会先调用 componentWillMount然后,准备加载组件,会调用 void componentWillMount()
这个函数调用时机是在组件创建,并初始化了状态之后,在第一次绘制 componentDidMount在组件第一次绘制之后,会调用 void componentDidMount()
这个函数调用的时候,其虚拟 DOM 已经构建完成,你可以在这个函数开始获取其中的元素或者子组件了。需要注意的是,RN 框架是先调用子组件的 componentWillReceiveProps如果组件收到新的属性(props),就会调用 void componentWillReceiveProps( object nextProps )
输入参数 componentWillReceiveProps: function(nextProps) { this.setState({ likesIncreasing: nextProps.likeCount > this.props.likeCount }); }
shouldComponentUpdate当组件接收到新的属性和状态改变的话,都会触发调用 boolean shouldComponentUpdate( object nextProps,object nextState )
输入参数 默认情况下,这个函数永远返回 componentWillUpdate如果组件状态或者属性改变,并且上面的 void componentWillUpdate( object nextProps,object nextState )
输入参数与 componentDidUpdate调用了 void componentDidUpdate( object prevProps,object prevState )
因为到这里已经完成了属性和状态的更新了,此函数的输入参数变成了 componentWillUnmount当组件要被从界面上移除的时候,就会调用 void componentWillUnmount()
在这个函数中,可以做一些组件相关的清理工作,例如取消计时器、网络请求等。 总结到这里,RN 的组件的完整的生命都介绍完了,在回头来看一下前面的图,就比较清晰了,把生命周期的回调函数总结成如下表格:
(编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |