wx小程序之页面栈和API跳转

页面栈

页面层级可能会有三层或者更多层，我们把这样的一个页面层级称为页面栈。
第一个元素为首页，最后一个元素为当前页面

分析：
为了方便理解，我们这样描述页面栈：[ pageA, pageB, pageC ]，其中pageA在最底下，pageC在最顶部，也就是用户所看到的界面

结合上面案例，比如当前正在浏览公司地址页面local，文件结构如下

则myself为PageA在最底部，local为PageC在最顶部，即当前浏览页
页面栈最大层级限制
注意：
刚开始开发小程序时，限制页面栈的最大层级为5层，后来接收到很多反馈，于是放大了限制，将其扩充到10层。
所以目前在编写的时候，小程序宿主环境限制页面栈的最大层级为10层 ，也就是当页面栈到达10层之后就没有办法再推入新的页面了。
“myself我的”页面代码案例

页面跳转-路由

(1)wx.navigateTo
为打开新页面，会增加页面栈大小，直到页面栈大小为10
描述： 打开新页面，将原来的页面保留在页面栈中。在跳入到下一个页面的时候，目标页面同时进入页面栈中，在这种情况下点击手机的返回按钮才可以跳转到上一个页面。即保留当前页面，跳转到应用内的某个页面，使用 wx.navigateBack 可以返回;

假如使用wx.navigateTo从四级页面跳转到二级页面，此时会在页面栈顶添加一个与二级页面初始状态一样的界面，但两个页面状态是独立的。

拓展：获取获取当前的页面栈
语法： getCurrentPages()
作用： 可通过 getCurrentPages() 获取当前的页面栈


(2)wx.navigateBack
为页面回退，会减少页面栈大小，直到页面栈大小为1
描述： 关闭当前页面，返回上一页面或多级页面。
可通过 getCurrentPages() 获取当前的页面栈，决定需要返回几层。

用法：

直接返回最后一层

（3）wx.redirectTo
为页面重定向，不会增加页面栈大小
描述： 关闭当前页面，跳转到应用内的某个页面。页面重定向，将页面重新定向到一个目标页面，并不能返回到上一个页面。

假如使用wx.redirectTo从四级页面重定向到二级页面，此时会将关闭四级页面，并使用二级页面替换四级页面，但两个页面状态是独立的。此时的页面栈大小不变
注意： wx.redirectTo和wx.navigateTo的区别。
当页面过多时，被保留页面会挤占微信分配给小程序的内存，或是达到微信所限制的10层页面栈。这时应该考虑选择 wx.redirectTo。
wx.redirectTo() 用于关闭当前页面，跳转到应用内的某个页面。
优缺点： 这样的跳转可以避免跳转前页面占据运行内存，但返回时页面需要重新加载，增加了返回页面的显示时间。

(4)wx.switchTab
为跳转tabBar页面专用API
描述： Tab切换，跳转的页面必须是app.json 中 tabBar 配置的页面。跳转到tabBar页面同时关闭其他非tabBar页面
注意： wx.navigateTo和wx.redirectTo只能打开非tabBar页面，switchTab只能跳转到带有tab的页面，不能跳转到不带tab的页面
小程序提供了原生的Tabbar支持，我们可以在app.json声明tabBar字段来定义Tabbar页

对于跳转到 tab bar 的页面，最好选择 wx.switchTab()，它会先关闭所有非 tab bar 的页面。
其次，也可以选择 wx.reLaunch()，它也能实现从非 tab bar 跳转到 tab bar，或在 tab bar 间跳转，效果等同 wx.switchTab()。使用其他跳转 API 来跳转到 tab bar，则会跳转失败。
(5)wx. reLaunch为重新启动， 可以打开任意页面
描述： 关闭所有页面，打开到应用内的某个页面。即重新启动， 可以打开任意页面。wx.reLaunch()与 wx.redirectTo()的用途基本相同， 只是 wx.reLaunch()先关闭了内存中所有保留的页面，再跳转到目标页面（此时页面栈变为[pageA]仅仅1层）。

路由+生命周期

Tab 切换对应的生命周期↓