原生小程序生命周期，路由跳转，本地存储等详解
生命周期，路由跳转，本地存储等API详解
原生小程序（Native Mini Program）是一种在微信小程序平台上开发的小程序类型，与传统的小程序开发方式（基于小程序框架）不同，原生小程序更加灵活，但也需要开发者自行处理更多的细节和逻辑。下面是一些原生小程序的常用API和功能的详解总结：
小程序api - 生命周期
1.应用生命周期
1.onLaunch
在小程序初始化时，会触发onLaunch生命周期函数。一般用于进行全局数据的初始化和获取，例如获取用户信息、检查登录状态等。
App({ onLaunch: function () { // 小程序初始化时触发 // 进行全局数据的初始化和获取 } })
2.onShow - 小程序启动或切换到前台
当小程序启动或从后台切换到前台时，会触发onShow生命周期函数。在这个阶段，可以执行一些需要实时更新的操作，比如获取用户位置、更新数据等。
App({ onShow: function () { // 小程序启动或切换到前台时触发 // 执行一些需要实时更新的操作 } })
3.onHide - 小程序切换到后台
当小程序切换到后台时，会触发onHide生命周期函数。在这个阶段，可以进行一些清理操作，比如保存用户数据、停止定时器等。
App({ onHide: function () { // 小程序切换到后台时触发 // 进行一些清理操作 } })
4.onError - 小程序发生错误
当小程序发生错误时，会触发onError生命周期函数。一般用于捕捉并处理小程序运行时的异常情况，例如网络请求失败、数据解析错误等。
App({ onError: function (error) { // 小程序发生错误时触发 // 处理小程序运行时的异常情况 } })
2.页面生命周期
1.onLoad
当页面加载时，会触发onLoad生命周期函数。一般在这个阶段进行页面初始化和数据加载的操作，例如请求数据、初始化参数等。
参数可以获取 wx.navigateTo 和 wx.redirectTo 及 中的 query
Page({ onLoad: function (options) { // 页面加载时触发 // 进行页面初始化和数据加载的操作 } }) // options：页面跳转过来携带的参数对象 onLoad(options) { console.log('App onLoad'); },
2.onShow
当页面显示时，会触发onShow生命周期函数。一般用于执行一些需要实时更新的操作，比如更新数据、刷新界面等。
页面显示。每次打开页面都会调用一次。
Page({ onShow: function () { // 页面显示时触发 // 执行一些需要实时更新的操作 } })
3.onReady
当页面初次渲染完成时，会触发onReady生命周期函数。一般用于执行一些只能在页面初次渲染完成后才能进行的操作，比如操作 DOM 元素、绑定事件等。
对界面的设置如 wx.setNavigationBarTitle 请在 onReady 之后设置
Page({ onReady: function () { // 页面初次渲染完成时触发 // 执行一些只能在页面初次渲染完成后才能进行的操作 } })
6.onHide
当页面隐藏时，会触发onHide生命周期函数。一般用于执行一些页面隐藏时需要处理的操作，比如停止动画、清除定时器等。
当 navigateTo 或底部 tab 切换时调用。
Page({ onHide: function () { // 页面隐藏时触发 // 执行一些页面隐藏时需要处理的操作 } })
7.onUnload 页面卸载
当页面被卸载时，会触发onUnload生命周期函数。一般用于执行一些页面卸载时需要处理的操作，比如释放资源、取消订阅等。
当返回上一页wx.navigateBack、wx.relanch、wx.redirectTo时都会被调用
Page({ onUnload: function () { // 页面卸载时触发 // 执行一些页面卸载时需要处理的操作 } })
3.组件生命周期
组件生命周期指的是小程序中自定义组件从创建到销毁的整个过程。小程序的组件生命周期主要包含以下几个关键阶段：
1.created
当组件实例被创建时，会触发created生命周期函数。在这个阶段，可以进行一些组件实例的初始化操作。
Component({ created: function () { // 组件实例被创建时触发 // 进行组件实例的初始化操作 } })
2.attached - 组件被添加到页面节点树
当组件被添加到页面节点树时，会触发attached生命周期函数。一般用于执行一些组件加载和渲染的操作。
Component({ attached: function () { // 组件被添加到页面节点树时触发 // 执行一些组件加载和渲染的操作 } })
3.ready - 组件初次渲染完成
当组件初次渲染完成时，会触发ready生命周期函数。一般用于执行一些只能在组件初次渲染完成后才能进行的操作。
Component({ ready: function () { // 组件初次渲染完成时触发 // 执行一些只能在组件初次渲染完成后才能进行的操作 } })
4.detached - 组件被从页面节点树移除
当组件被从页面节点树移除时，会触发detached生命周期函数。一般用于执行一些组件卸载和清理的操作。
Component({ detached: function () { // 组件被从页面节点树移除时触发 // 执行一些组件卸载和清理的操作 } })
小程序api -跳转页面
1.标签跳转
<navigator url="........"></navigator>
2.wx.navigateTo
跳转后左上角有返回小箭头,点击可返回原本页面.
wx.navigateTo({ url: '/pages/calculator/calculator', })
3.wx.redirectTo
关闭当前页面，跳转到应用内的某个页面、跳转后左上角没有返回小箭头
wx.redirectTo({ url: '/pages/calculator/calculator', })
4.wx.switchTab
跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面；该方法只能跳转 tabbar 页面.
wx.switchTab({ url: '/pages/calculator/calculator', })
5.wx.reLaunch
关闭所有页面，打开到应用内的某个页面。左上角不会出现返回箭头
wx.reLaunch({ url: '/pages/calculator/calculator', })
微信小程序本地存储
异步存储：wx.setStorage
wx.setStorage({ key:"key", data:"value", encrypt: true, // 若开启加密存储，setStorage 和 getStorage 需要同时声明 encrypt 的值为 true success() { //设置本地存储后的回调 } }
同步存储：wx.setStorageSync 存入一个数据，复杂类型数据不需要 JSON.stringify 处理
异步获取：wx.getStorage
同步获取：wx.getStorageSync 读取本地key数据，复杂类型数据不需要 JSON.parse 处理
wx.removeStorageSync(key) 删除本地key数据
wx.clearStorageSync()清空本地全部数据
小结：
wx.setStorage 与 wx.setStorageSync的区别是：
wx.setStorage为异步存储–无论方法执行成功与否，都会继续向下执
wx.setStorageSync为同步存储–必须要同步方法处理完，程序才能继续向下执行
使用异步,性能会更好;而使用同步,数据会更安全。
以上就是原生小程序生命周期，路由跳转，本地存储等详解请求时感谢大家的阅读
如碰到其他的问题 可以私下我 一起探讨学习
如果对你有所帮助还请 点赞 收藏谢谢~！
关注收藏博客 作者会持续更新…
