uniapp 微信小程序路径跳转封装

main.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
Vue.prototype.$to = function(href) {
if(!href) {
// 没有跳转信息
return;
}

// 跳转网页
if(href.indexOf('http') === 0) {
return uni.navigateTo({
url: '/pages/other/webview',
success: function(res) {
// 这里的接收可以看一下监听器那块,也方便编码 URL 的混乱。
res.eventChannel.emit('href', href);
},
});
}

// 跳转其他小程序
if(href.indexOf('wx') === 0) {
const identifier_index = href.indexOf('|');

if(identifier_index === false) {
return wx.navigateToMiniProgram({
appId: href,
});
}

href = [
href.substring(0, identifier_index),
href.substring(identifier_index + 1),
].filter(v => v);

if(href.length === 1) {
return wx.navigateToMiniProgram({
appId: href[0],
});
}

return wx.navigateToMiniProgram({
appId: href[0],
path: href[1] || '',
});
}

if(href.indexOf('/pages/') !== 0 && href.indexOf('pages/') !== 0) {
return uni.showToast({
title: '路径错误',
icon: 'none',
});
}

const pages = getCurrentPages();

const page = pages[pages.length - 1];

const identifier_index = href.indexOf('?');

const _href = [
href.substring(0, identifier_index),
href.substring(identifier_index),
].split('?').filter(v => v);

// 跳转同页面
if(_href[0] === '/' + page.route) {
// 参数转换成 obj
const param = qs.parse(_href[1] || '');

page.onLoad && page.onLoad(param);

return;
}

// 判断下是不是跳转 tabbar 页(正则只能自己改,是无法读取到 pages.json 的)
if (/^\/pages\/(index|personal)\/index$/g.test(_href[0])) {
return uni.switchTab({
url: _href[0],
success: function() {
// tabbar 页是不能带参数的,不过你可以通过事件的方式来传递
// https://uniapp.dcloud.io/api/window/communication?id=emit
},
});
}

// if(pages.length >= 32) {
// return uni.showToast({
// title: '页面跳转层级过多',
// icon: 'none',
// });
// }

// 跳转其他页面
uni.navigateTo({
url: href,
});

return;
}

使用

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
// 跳转网页
// 需要以 http 开头。需要在微信管理平台配置 web-view 白名单。
this.$to('https://www.hongfs.cn');
this.$to('https://www.hongfs.cn/index.html?id=1#123');

// 跳转外部小程序
// APPID 加上具体路径,中间用 | 拼接
this.$to('wx645b13cb3307661f');
this.$to('wx645b13cb3307661f|/pages/index/index');
this.$to('wx645b13cb3307661f|/pages/index/index?id=123');

// 小程序内跳转
// 路径加参数,中间用 ? 拼接
this.$to('/pages/index/index');
this.$to('/pages/index/index?id=123');
往上