微信小程序的路由以及分包的使用

由于受到微信的限制，小程序的文件不能大于2M，有时候就不得不使用分包预下载，根据需求进行加载。

微信小程序页面跳转（路由）

组件：navigator

以组件的形式嵌套在页面内，实现跳转，类似于HTML中的a标签。常见的属性：

target：在哪个目标上发生跳转，属性值为self，默认值，在当前小程序内部跳转；miniProgram其他小程序。

open-type：跳转的形式，属性值为：navigate，实现了wx.navigateTo或者是wx.navigateToMiniProgram的功能；redirect、switchTab、reLaunch、navigateBack、exit

API： wx.switchTab、wx.reLaunch、wx.redirectTo、wx.navigateTo、wx.navigateBack。

wx.switchTab：跳转到tabBar页面，并且关闭其他非tabBar页面。路径为app.json里面配置的tabBar字段定义的页面；路径后不能带有参数。

wx.reLaunch：关闭所有页面，跳转到小程序内的某一个页面，路径后可以带有参数，如：‘path?key=value&key1=value1’；

wx.redirectTo:关闭当前页面，跳转到小程序内的某一个页面，但是不允许跳转到tabBar页面，路径后面可以带有参数；

wx.navigateTo：保留当前页面，跳转到小程序内部的某一个页面，不能跳转到tabBar页面，通过wx.navigateBack返回上一页面。

wx.navigateBack：关闭当前页面，返回上一页面或者多级页面，通过getCurrentPages获取当前的页面栈，设置需要返回几层页面。

分包加载

<code>{
  "pages": ["pages/index", "pages/logs"],//主包
  "subpackages": [
    {
      "root": "packageA",
      "pages": ["pages/cat", "pages/dog"]
    },
    {
      "root": "packageB",
      "name": "pack2",
      "pages": ["pages/apple", "pages/banana"]
    }
  ]
}
</code>

subpackages：设置分包，每个分包的配置有：

root: 分包的根目录

name: 分包的别名，在分包预下载时可以使用

pages：分包的页面路径，相对于分包根目录

independent:是否是独立分包（Boolean值）

独立分包

可以独立于主包和其他分包运行，从独立分包进入小程序时是不需要下载主包，用户进入主包或者普通页面时才下载主包。

分包预下载是在进入某个页面时触发，通过app.json的配置项preloadRule来进行控制。如下：

<code>{
  "pages": ["pages/index"],
  "subpackages": [
    {
      "root": "important",
      "pages": ["index"]
    },
    {
      "root": "sub1",
      "pages": ["index"]
    },
    {
      "name": "hello",
      "root": "path/to",
      "pages": ["index"]
    },
    {
      "root": "sub3",
      "pages": ["index"]
    },
    {
      "root": "indep",
      "pages": ["index"],
      "independent": true
    }
  ],
  "preloadRule": {
    "pages/index": {
      "network": "all",
      "packages": ["important"]
    },
    "sub1/index": {
      "packages": ["hello", "sub3"]
    },
    "sub3/index": {
      "packages": ["path/to"]
    },
    "indep/index": {
      "packages": ["__APP__"]
    }
  }
}
</code>

key为sub3/index时页面路径，value为”packages”: [“hello”, “sub3”]是进入页面后预下载包的root或者是name；

“network”:”wifi”是指定了网络下下载，默认是wifi，all是不限定网络