小程序 跳转分包页面 点击多次的时候会跳转多次的问题

前言:

我们的小程序有做分包,tabbar 的四个页面以及 webview 页面放主包,其他的页面按照模块分了 user、order、mall的分包

问题:

产品在验收小程序的时候,发现在个人中心页面快速的点两次 我的订单 按钮,小程序就会跳转两次页面,一开始我们还不知道是什么原因,按照正常来说点一次就会马上跳转了。后来在微信开发者工具调为弱网模式试了下,发现点了按钮后,下方的状态栏显示在加载页面,这时候就懂了,因为那个页面是分包的页面,小程序只会主动加载主包的页面,分包的页面在访问时才会加载,所以点的快的话分包还在加载中,等加载完后因为快速点了几次就跳了几次页面

解决:

这个问题解决起来也很简单,小程序提供了一个分包预下载的功能,可以通过配置,在进入小程序某个页面的时候,就去预下载需要的分包,提升后续进入分包页面时的启动速度

配置方法:

app.json 增加 preloadRule 配置来控制

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
{
"pages": ["pages/index"],
"subpackages": [
{
"root": "sub1",
"pages": ["index"],
},
{
"root": "sub2",
"pages": ["index"]
}
],
"preloadRule": {
"pages/index": {
"network": "all",
"packages": ["sub1", "sub2"]
},
}
}