uniapp的生命周期及其和vue生命周期的对比
uni-app应用生命周期
uni-app部分页面生命周期
vue生命周期(注:这也是Uniapp组件的生命周期)
uni-app页面生命周期与vue生命周期的对比
页面加载过程
加载 -> 显示 -> 加载完成 -> 页面隐藏 -> 页面卸载
uni-app页面加载过程
onLoad:监听页面加载 -> onShow:监听页面显示 -> onReady:监听页面初次渲染完成 -> onHide:监听页面隐藏 -> onUnload:监听页面卸载
vue页面加载过程
created:实例被创建后执行 -> beforeMount: 实例被挂载之前执行 -> mounted:实例挂载完成后执行 -> updated:页面更新后执行 -> beforeDestroy:页面销毁前执行
根据以上对比:建议:
1、uni-app的页面生命周期仅在page页面有效,而单独封装的组件中【页面周期无效】,但是Vue的生命周期依然有效 【Vue的生命周期在任何地方都是有效的,即你仍然可以在uni-app项目中使用Vue生命周期,但是不建议这么做】
2、推荐使用uni-app里面的onLoad 代替 vue 里面的 created
3、推荐使用uni-app里面的onReady 代替 vue 里面的 mounted
4、uniapp的子组件里是没有onLoad,onReady等页面生命周期,要使用created,mounted等Vue生命周期
uni-app生命周期
https://uniapp.dcloud.io/frame?id=生命周期