微信小程序（4）

1.页面导航

即跳转页面

小程序实现页面导航的两种方式

声明式导航：在页面上声明一个 <navigator> 导航组件 通过点击 <navigator> 组件实现页面跳转

导航到tabBar页面：

 

注意：url必须以/开头，open-type必须为switchTab 

导航到非tabBar页面：

则open-type必须为navigate，导航到非tabBar页面时open-type默认为navigate，所以也可以不写

 后退导航：

后退到上一页或多级页面则要指定open-type和delta属性

open-type 的值必须是 navigateBack，表示要进行后退导航  

delta 的值必须是数字，表示要后退的层级 ，为了简便，如果只是后退到上一页面，则可以省略 delta 属性，因为其默认值就是 1

编程式导航：调用小程序的导航 API，实现页面的跳转

（绑定事件，定义事件处理函数）

跳转到tabBar页面：

使用wx.switchTab

 跳转到非TabBar页面：

使用wx.navigateTo

 后退导航：

使用wx.navigateBack

导航传参

 声明式：

navigator 组件的 url 属性用来指定将要跳转到的页面的路径。

同时，路径的后面还可以携带参数：  

参数与路径之间使用 ? 分隔  

参数键与参数值用 = 相连  

不同参数用 & 分隔 

注意：跳转到tabBar是无法传参的

编程式：

在onLoad中接收导航参数

 

 一般会转存到data中

2.页面事件

下拉刷新

全局：

在app.json的window节点中，将enablePullDownRefresh设置为true

局部：

在页面的.json中，将enablePullDownRefresh设置为true

样式配置：

在全局或页面的 .json 配置文件中，通过 backgroundColor 和 backgroundTextStyle 来配置下拉刷新窗口的样式，其中：  

backgroundColor 用来配置下拉刷新窗口的背景颜色，仅支持16 进制的颜色值 backgroundTextStyle 用来配置下拉刷新 loading 的样式，仅支持 dark 和 light

监听：

在.js文件中，有onPullDownRefresh() 

停止下拉刷新：

当处理完下拉刷新后，下拉刷新的 loading 效果会一直显示，不会主动消失，所以需要手动隐藏下拉刷新的 loading 效果。此时，调用 wx.stopPullDownRefresh() 可以停止当前页面的下拉刷新。

上拉触底

监听：

在页面的 .js 文件中，通过 onReachBottom() 函数即可监听当前页面的上拉触底事件。

开发中常与节流配合，使得同一时间只有一个请求被发送

3.生命周期

应用生命周期

小程序的生命周期函数是在app.js里面调用的，通过App(Object)函数用来注册一个小程序，指定其小程序的生命周期回调

页面生命周期

页面生命周期函数就是当你每进入/切换到一个新的页面的时候，就会调用的生命周期函数，同样通过App(Object)函数用来注册一个页面

生命周期函数

 应用的生命周期函数

 

页面的生命周期函数

 

4.WXS脚本

一种脚本语言，常用作过滤器

内嵌

外联