前端实习第6天--支付宝小程序的生命周期

小程序的生命周期分为组件生命周期和页面生命周期

组件生命周期

支付宝小程序的组件一共有六个状态，官方给出的文档如下：

 生命周期之onInit函数

onInit在组件创建时触发。此时组件刚刚被创建出来，只能访问组件中定义的属性和数据，还不能访问dom元素等。

具体可以访问以下属性：

• 访问 this.is、this.$id、this.$page 等属性

• 访问 this.data、this.props 等属性

• 访问组件 methods 中的自定义属性

• 调用 this.setData、this.$spliceData 修改数据

生命周期之deriveDataFromProps

deriveDataFromProps 在组件创建和更新时都会触发。

具体可以访问以下属性：

• 访问 this.is、this.$id、this.$page 等属性

• 访问this.data、this.props 等属性

• 访问组件 methods 中的自定义属性

• 调用this.setData、this.$spliceData 修改数据

• 可以使用 nextProps 参数获取将要更新的 props 参数

生命周期之didMount

didMount 为自定义组件首次渲染完毕后的回调，此时页面已经渲染，通常在这时请求服务端数据。

生命周期之didUpdate

didUpdate 为自定义组件数据更新后的回调，每次组件数据变更的时候都会调用。

生命周期之didUnmount

didUnmount 为自定义组件被卸载后的回调，每当组件实例从页面卸载的时候都会触发此回调。

onError

onError 为自定义组件 js 代码执行抛出出错时的回调。

页面生命周期

关于小程序页面的生命周期，官方文档是这样定义的：

其实也是分为五大状态：

onLoad: 页面加载。一个页面只会调用一次，query 参数为 my.navigateTo 和 my.redirectTo 中传递的 query 对象。
onShow: 页面显示。每次页面显示都会调用一次。
onReady: 页面初次渲染完成。一个页面只会调用一次，代表页面已经准备妥当，可以和视图层进行交互。对界面的设置，如 my.setNavigationBar 请在 onReady 之后设置。
onHide: 页面隐藏。当 my.navigateTo 到其他页面或底部 tab 切换时调用。
onUnload: 页面卸载。当 my.redirectTo 或 my.navigateBack 到其他页面的时候调用。