小程序

课程大纲

（1）数据操作限制补充
（2）页面栈
（3）API页面跳转—router路由API
wx.navigateTo
wx.navigateBack
wx.redirectTo
wx.switchTab
wx.reLaunch

数据操作限制

针对上节所讲的程序注册器与页面注册器，简单做下补充，即页面数据data的操作限制
（1）直接修改Page实例的this.data而不调用this.setData是无法改变页面的状态的，还会造成数据不一致。
（2）由于setData是需要两个线程的一些通信消耗，为了提高性能，每次设置的数据不应超过1024KB；
（3）不要把data中任意一项的value设为undefined，否则可能会引起一些不可预料的bug。

页面栈

一个小程序拥有多个页面，且部分页面可能是互相嵌套的

页面代码案例

“myself我的”页面代码案例


页面层级可能会有三层或者更多层，我们把这样的一个页面层级称为页面栈。

第一个元素为首页，最后一个元素为当前页面

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

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

则myself为PageA在最底部，local为PageC在最顶部，即当前浏览页

页面栈最大层级限制

注意：
刚开始开发小程序时，限制页面栈的最大层级为5层，后来接收到很多反馈，于是放大了限制，将其扩充到10层。
所以目前在编写的时候，小程序宿主环境限制页面栈的最大层级为10层 ，也就是当页面栈到达10层之后就没有办法再推入新的页面了。

页面跳转-路由

接下来结合上边[ pageA, pageB, pageC ]页面栈描述以下几个和导航相关的API
（1）wx.navigateTo
（2）wx.navigateBack
（3）wx.redirectTo
（4）wx.switchTab
（5）wx.reLaunch

（1）wx.navigateTo

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

案例：wx.navigateTo({ url: ‘pageD’ }) 可以往当前页面栈多推入一个 pageD，此时页面栈变成 [ pageA, pageB, pageC, pageD ]

（1）wx.navigateTo —页面栈[pageA]变为[pageA,pageB]


（1）页面栈[pageA,pageB]变为页面栈[pageA,pageB,pageC]

（1）wx.navigateTo

（1）wx.navigateTo 验证页面栈同页叠加
接下来验证下上述导图

（1）wx.navigateTo 验证页面栈同页叠加
接着上面验证，点击公司地址跳到公司地址页面，此时再在公司地址页面中添加跳页按钮，利用wx.navigateTo方法跳到公司信息页面

（1）wx.navigateTo验证页面栈状态独立
跟验证页面栈同页叠加步骤类似，在公司信息页面添加操作按钮

（1）wx.navigateTo验证页面栈状态独立

跟验证页面栈同页叠加步骤类似，在公司信息页面添加