@tarojs/router 4.0.0-alpha.2 → 4.0.0-alpha.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +1 -8
- package/dist/api.d.ts +6 -7
- package/dist/api.js +9 -17
- package/dist/events/resize.d.ts +2 -3
- package/dist/events/scroll.d.ts +2 -3
- package/dist/history.d.ts +10 -8
- package/dist/history.js +2 -1
- package/dist/index.cjs.js +338 -214
- package/dist/index.d.ts +9 -10
- package/dist/index.esm.js +337 -214
- package/dist/index.js +3 -3
- package/dist/navigationBar.d.ts +2 -2
- package/dist/navigationBar.js +24 -7
- package/dist/router/index.d.ts +3 -4
- package/dist/router/index.js +3 -2
- package/dist/router/mpa.d.ts +4 -5
- package/dist/router/mpa.js +12 -7
- package/dist/router/multi-page.d.ts +7 -8
- package/dist/router/navigation-bar.d.ts +8 -4
- package/dist/router/navigation-bar.js +62 -19
- package/dist/router/page.d.ts +11 -10
- package/dist/router/page.js +26 -14
- package/dist/router/spa.d.ts +4 -5
- package/dist/router/spa.js +27 -15
- package/dist/router/stack.d.ts +2 -2
- package/dist/style.d.ts +4 -5
- package/dist/style.js +52 -13
- package/dist/tabbar.d.ts +2 -3
- package/dist/utils/index.d.ts +2 -3
- package/dist/utils/navigate.d.ts +6 -6
- package/dist/utils/navigate.js +5 -2
- package/package.json +18 -27
- package/types/api.d.ts +5 -0
- package/dist/index.cjs.d.ts +0 -65
- package/dist/index.esm.d.ts +0 -65
package/dist/index.cjs.js
CHANGED
|
@@ -4,10 +4,181 @@ var components = require('@tarojs/components/dist/components');
|
|
|
4
4
|
var taro = require('@tarojs/taro');
|
|
5
5
|
var tslib = require('tslib');
|
|
6
6
|
var runtime = require('@tarojs/runtime');
|
|
7
|
+
var shared = require('@tarojs/shared');
|
|
7
8
|
var history = require('history');
|
|
8
9
|
var queryString = require('query-string');
|
|
9
10
|
var UniversalRouter = require('universal-router');
|
|
10
11
|
|
|
12
|
+
/**
|
|
13
|
+
* 插入页面动画需要的样式
|
|
14
|
+
*/
|
|
15
|
+
function loadAnimateStyle(ms = 300) {
|
|
16
|
+
const css = `
|
|
17
|
+
body {
|
|
18
|
+
/* 防止 iOS 页面滚动 */
|
|
19
|
+
overflow: hidden;
|
|
20
|
+
}
|
|
21
|
+
.taro_router > .taro_page {
|
|
22
|
+
position: absolute;
|
|
23
|
+
left: 0;
|
|
24
|
+
top: 0;
|
|
25
|
+
width: 100%;
|
|
26
|
+
height: 100%;
|
|
27
|
+
background-color: #fff;
|
|
28
|
+
transform: translate(100%, 0);
|
|
29
|
+
transition: transform ${ms}ms;
|
|
30
|
+
z-index: 0;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
.taro_router > .taro_page.taro_tabbar_page,
|
|
34
|
+
.taro_router > .taro_page.taro_page_show.taro_page_stationed {
|
|
35
|
+
transform: none;
|
|
36
|
+
transition: none;
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
.taro_router > .taro_page.taro_page_show {
|
|
40
|
+
transform: translate(0, 0);
|
|
41
|
+
}
|
|
42
|
+
`;
|
|
43
|
+
addStyle(css);
|
|
44
|
+
}
|
|
45
|
+
/**
|
|
46
|
+
* 插入路由相关样式
|
|
47
|
+
*/
|
|
48
|
+
function loadRouterStyle(enableTabBar, enableWindowScroll) {
|
|
49
|
+
const css = `
|
|
50
|
+
.taro_router {
|
|
51
|
+
position: relative;
|
|
52
|
+
width: 100%;
|
|
53
|
+
height: 100%;
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
.taro_page {
|
|
57
|
+
width: 100%;
|
|
58
|
+
height: 100%;
|
|
59
|
+
${enableWindowScroll ? '' : `
|
|
60
|
+
overflow-x: hidden;
|
|
61
|
+
overflow-y: scroll;
|
|
62
|
+
max-height: 100vh;
|
|
63
|
+
`}
|
|
64
|
+
}
|
|
65
|
+
${enableTabBar ? `
|
|
66
|
+
.taro-tabbar__container > .taro-tabbar__panel {
|
|
67
|
+
overflow: hidden;
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
.taro-tabbar__container > .taro-tabbar__panel > .taro_page.taro_tabbar_page {
|
|
71
|
+
max-height: calc(100vh - var(--taro-tabbar-height) - constant(safe-area-inset-bottom));
|
|
72
|
+
max-height: calc(100vh - var(--taro-tabbar-height) - env(safe-area-inset-bottom));
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
` : ''}
|
|
76
|
+
.taro_page_shade:has(+.taro_page_stationed),
|
|
77
|
+
.taro_page_shade.taro_tabbar_page,
|
|
78
|
+
.taro_router > .taro_page.taro_page_show.taro_page_stationed:not(.taro_page_shade):not(.taro_tabbar_page):not(:last-child):has(+.taro_page_stationed) {
|
|
79
|
+
display: none;
|
|
80
|
+
}
|
|
81
|
+
`;
|
|
82
|
+
addStyle(css);
|
|
83
|
+
}
|
|
84
|
+
/**
|
|
85
|
+
* 插入导航栏相关的样式
|
|
86
|
+
*/
|
|
87
|
+
function loadNavigationBarStyle() {
|
|
88
|
+
const css = `
|
|
89
|
+
.taro-navigation-bar-show {
|
|
90
|
+
display: flex;
|
|
91
|
+
background: white;
|
|
92
|
+
position: sticky;
|
|
93
|
+
z-index: 500;
|
|
94
|
+
top: 0;
|
|
95
|
+
padding-bottom: 8px;
|
|
96
|
+
padding-top: calc(env(safe-area-inset-top) + 8px);
|
|
97
|
+
justify-content: center;
|
|
98
|
+
align-items: center;
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
.taro-navigation-bar-hide {
|
|
102
|
+
display: none;
|
|
103
|
+
}
|
|
104
|
+
|
|
105
|
+
.taro-navigation-bar-title-wrap {
|
|
106
|
+
display: flex;
|
|
107
|
+
height: 24px;
|
|
108
|
+
}
|
|
109
|
+
|
|
110
|
+
.taro-navigation-bar-title-wrap > .taro-navigation-bar-loading {
|
|
111
|
+
display: none;
|
|
112
|
+
animation: loading 2s linear infinite;
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
.taro-navigation-bar-title-wrap .taro-navigation-bar-loading.taro-navigation-bar-loading-show {
|
|
116
|
+
display: flex;
|
|
117
|
+
}
|
|
118
|
+
|
|
119
|
+
.taro-navigation-bar-title-wrap > .taro-navigation-bar-title {
|
|
120
|
+
font-size: 24px;
|
|
121
|
+
height: 24px;
|
|
122
|
+
line-height: 24px;
|
|
123
|
+
max-width: 100px;
|
|
124
|
+
white-space: nowrap;
|
|
125
|
+
overflow: hidden;
|
|
126
|
+
line-height: 24px;
|
|
127
|
+
text-overflow: ellipsis;
|
|
128
|
+
}
|
|
129
|
+
|
|
130
|
+
@keyframes loading {
|
|
131
|
+
from {
|
|
132
|
+
transform: rotate(0deg);
|
|
133
|
+
}
|
|
134
|
+
to {
|
|
135
|
+
transform: rotate(360deg);
|
|
136
|
+
}
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
@keyframes loading {
|
|
140
|
+
from {
|
|
141
|
+
transform: rotate(0deg);
|
|
142
|
+
}
|
|
143
|
+
to {
|
|
144
|
+
transform: rotate(360deg);
|
|
145
|
+
}
|
|
146
|
+
}
|
|
147
|
+
|
|
148
|
+
.taro-navigation-bar-no-icon > .taro-navigation-bar-home {
|
|
149
|
+
display: none;
|
|
150
|
+
}
|
|
151
|
+
|
|
152
|
+
.taro-navigation-bar-no-icon > .taro-navigation-bar-back {
|
|
153
|
+
display: none;
|
|
154
|
+
}
|
|
155
|
+
|
|
156
|
+
.taro-navigation-bar-home-icon > .taro-navigation-bar-home {
|
|
157
|
+
display: flex;
|
|
158
|
+
left: 8px;
|
|
159
|
+
position: absolute;
|
|
160
|
+
width: 24px;
|
|
161
|
+
height: 24px;
|
|
162
|
+
}
|
|
163
|
+
|
|
164
|
+
.taro-navigation-bar-back-icon > .taro-navigation-bar-back {
|
|
165
|
+
display: flex;
|
|
166
|
+
left: 8px;
|
|
167
|
+
position: absolute;
|
|
168
|
+
width: 24px;
|
|
169
|
+
height: 24px;
|
|
170
|
+
}
|
|
171
|
+
`;
|
|
172
|
+
addStyle(css);
|
|
173
|
+
}
|
|
174
|
+
function addStyle(css) {
|
|
175
|
+
if (!css)
|
|
176
|
+
return;
|
|
177
|
+
const style = document.createElement('style');
|
|
178
|
+
style.innerHTML = css;
|
|
179
|
+
document.getElementsByTagName('head')[0].appendChild(style);
|
|
180
|
+
}
|
|
181
|
+
|
|
11
182
|
const home_svg_str = `
|
|
12
183
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
13
184
|
<path d="M23.8899 12.2737C23.8232 12.3584 23.7237 12.3997 23.6198 12.3974H20.7994V23.5996C20.7994 23.8194 20.6213 24 20.4001 24H14.7994C14.5791 24 14.4002 23.8194 14.4002 23.5996V15.6H9.59963V23.5996C9.59963 23.8194 9.42075 24 9.20033 24H3.59968C3.48981 24 3.38964 23.954 3.31764 23.8811C3.24495 23.8091 3.2004 23.7087 3.2004 23.5996V12.3975H0.398546V12.3967C0.296893 12.396 0.194446 12.3544 0.11579 12.2738C-0.0371146 12.114 -0.0400714 11.864 0.11579 11.7076L11.7201 0.117284C11.8767 -0.0390948 12.1298 -0.0390948 12.2863 0.117284L23.8899 11.7076C24.0465 11.864 24.0265 12.0995 23.8899 12.2737ZM12.0029 0.964625L1.37086 11.5854L3.59968 11.5839V11.5999C3.65537 11.5999 3.70804 11.611 3.75557 11.6307C3.89952 11.692 4.00046 11.8339 4.00046 11.9996V23.1991H8.79955V15.2003C8.79955 14.9789 8.97917 14.8002 9.20033 14.8002H14.7995C15.0207 14.8002 15.2003 14.9789 15.2003 15.2003V23.1991H20.0001V11.9996C20.0001 11.8339 20.1003 11.692 20.2443 11.6307C20.2918 11.611 20.3453 11.5999 20.4001 11.5999V11.5713L22.6193 11.5691L12.0029 0.964625Z" fill="currentColor"/>
|
|
@@ -17,21 +188,36 @@ const back_svg_str = `
|
|
|
17
188
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
18
189
|
<path d="M17.8206 22.9016L7.45515 11.8756L17.8206 1.09845C18.0598 0.849741 18.0598 0.435233 17.8206 0.186528C17.5814 -0.0621762 17.1827 -0.0621762 16.9435 0.186528L6.1794 11.4611C5.9402 11.7098 5.9402 12.1244 6.1794 12.3731L16.9435 23.8135C17.1827 24.0622 17.5814 24.0622 17.8206 23.8135C18.0598 23.5648 18.0598 23.1503 17.8206 22.9016Z" fill="currentColor"/>
|
|
19
190
|
</svg>
|
|
20
|
-
|
|
21
191
|
`;
|
|
22
|
-
|
|
23
|
-
|
|
192
|
+
const loading_svg_str = `
|
|
193
|
+
<svg t="1709608074670" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4741" width="24" height="24"><path d="M256 529.066667H85.333333a17.066667 17.066667 0 1 1 0-34.133334h170.666667a17.066667 17.066667 0 0 1 0 34.133334z" opacity=".278" p-id="4742"></path><path d="M99.84 640a17.066667 17.066667 0 0 1-4.437333-33.553067l164.693333-44.373333a17.066667 17.066667 0 1 1 8.891733 32.9728l-164.693333 44.373333a17.544533 17.544533 0 0 1-4.4544 0.580267z" opacity=".322" p-id="4743"></path><path d="M264.533333 462.523733a16.896 16.896 0 0 1-4.369066-0.580266l-164.693334-43.52a17.0496 17.0496 0 1 1 8.721067-32.989867l164.693333 43.52a17.066667 17.066667 0 1 1-4.352 33.570133z" opacity=".239" p-id="4744"></path><path d="M384.017067 307.2a17.032533 17.032533 0 0 1-14.7968-8.533333l-85.333334-147.626667a17.066667 17.066667 0 0 1 29.559467-17.083733l85.333333 147.626666A17.066667 17.066667 0 0 1 384.017067 307.2z" opacity=".122" p-id="4745"></path><path d="M639.982933 307.2a17.0496 17.0496 0 0 1-14.762666-25.6l85.333333-147.626667a17.066667 17.066667 0 1 1 29.559467 17.066667l-85.333334 147.626667a17.032533 17.032533 0 0 1-14.7968 8.533333z" opacity=".922" p-id="4746"></path><path d="M692.906667 347.306667a17.066667 17.066667 0 0 1-12.117334-29.098667l120.337067-121.173333a17.066667 17.066667 0 1 1 24.234667 24.046933l-120.337067 121.173333a17.1008 17.1008 0 0 1-12.117333 5.051734z" opacity=".878" p-id="4747"></path><path d="M733.883733 401.066667a17.066667 17.066667 0 0 1-8.5504-31.8464l147.626667-85.333334a17.0496 17.0496 0 1 1 17.066667 29.5424l-147.626667 85.333334a16.776533 16.776533 0 0 1-8.516267 2.304z" opacity=".839" p-id="4748"></path><path d="M512 273.066667a17.066667 17.066667 0 0 1-17.066667-17.066667V85.333333a17.066667 17.066667 0 0 1 34.133334 0v170.666667a17.066667 17.066667 0 0 1-17.066667 17.066667z" p-id="4749"></path><path d="M578.577067 281.6a17.066667 17.066667 0 0 1-16.520534-21.418667l43.52-164.693333a17.066667 17.066667 0 0 1 33.006934 8.721067l-43.52 164.693333a17.066667 17.066667 0 0 1-16.4864 12.6976z" opacity=".961" p-id="4750"></path><path d="M445.44 282.453333a17.066667 17.066667 0 0 1-16.469333-12.629333l-44.373334-164.693333a17.066667 17.066667 0 0 1 32.955734-8.891734l44.373333 164.693334a17.066667 17.066667 0 0 1-16.4864 21.521066z" opacity=".078" p-id="4751"></path><path d="M924.177067 640c-1.4848 0-2.9696-0.187733-4.4544-0.580267l-164.693334-44.373333a17.066667 17.066667 0 0 1 8.874667-32.9728l164.693333 44.373333a17.066667 17.066667 0 0 1-4.420266 33.553067z" opacity=".722" p-id="4752"></path><path d="M881.476267 742.4a17.015467 17.015467 0 0 1-8.482134-2.269867l-148.48-85.333333a17.0496 17.0496 0 1 1 16.9984-29.5936l148.48 85.333333a17.0496 17.0496 0 0 1-8.516266 31.863467z" opacity=".678" p-id="4753"></path><path d="M813.226667 830.293333a17.015467 17.015467 0 0 1-12.066134-5.000533l-120.337066-120.337067a17.0496 17.0496 0 1 1 24.132266-24.132266l120.337067 120.337066a17.0496 17.0496 0 0 1-12.066133 29.1328z" opacity=".639" p-id="4754"></path><path d="M938.666667 529.066667H768a17.066667 17.066667 0 1 1 0-34.133334h170.666667a17.066667 17.066667 0 1 1 0 34.133334z" opacity=".761" p-id="4755"></path><path d="M401.066667 941.226667a17.066667 17.066667 0 0 1-16.4864-21.504l44.373333-164.693334a17.066667 17.066667 0 1 1 32.955733 8.874667l-44.373333 164.693333a17.066667 17.066667 0 0 1-16.469333 12.629334z" opacity=".478" p-id="4756"></path><path d="M298.6496 898.56a17.066667 17.066667 0 0 1-14.779733-25.565867l85.333333-148.48a17.083733 17.083733 0 0 1 29.5936 16.9984l-85.333333 148.48a17.032533 17.032533 0 0 1-14.813867 8.567467z" opacity=".439" p-id="4757"></path><path d="M512 955.733333a17.066667 17.066667 0 0 1-17.066667-17.066666V768a17.066667 17.066667 0 1 1 34.133334 0v170.666667a17.066667 17.066667 0 0 1-17.066667 17.066666z" opacity=".522" p-id="4758"></path><path d="M725.3504 898.56a17.032533 17.032533 0 0 1-14.7968-8.533333l-85.333333-147.626667a17.066667 17.066667 0 0 1 29.559466-17.066667l85.333334 147.626667a17.066667 17.066667 0 0 1-14.762667 25.6z" opacity=".6" p-id="4759"></path><path d="M622.062933 942.08c-7.509333 0-14.421333-5.0176-16.469333-12.629333l-44.3904-164.693334a17.066667 17.066667 0 1 1 32.9728-8.874666l44.3904 164.693333a17.066667 17.066667 0 0 1-16.503467 21.504z" opacity=".561" p-id="4760"></path><path d="M759.4496 463.36a17.083733 17.083733 0 0 1-4.420267-33.553067l164.693334-44.373333a17.066667 17.066667 0 0 1 8.874666 32.955733l-164.693333 44.373334a16.657067 16.657067 0 0 1-4.4544 0.597333z" opacity=".702" p-id="4761"></path><path d="M330.24 347.306667a17.015467 17.015467 0 0 1-12.066133-5.000534l-120.32-120.32a17.0496 17.0496 0 1 1 24.132266-24.132266l120.32 120.32a17.0496 17.0496 0 0 1-12.066133 29.1328z" opacity=".161" p-id="4762"></path><path d="M290.116267 401.066667a17.032533 17.032533 0 0 1-8.533334-2.286934l-147.626666-85.333333a17.066667 17.066667 0 1 1 17.083733-29.5424l147.626667 85.333333a17.066667 17.066667 0 0 1-8.5504 31.829334z" opacity=".2" p-id="4763"></path><path d="M142.523733 742.4a17.066667 17.066667 0 0 1-8.567466-31.8464l147.626666-85.333333a17.066667 17.066667 0 1 1 17.083734 29.559466l-147.626667 85.333334a16.930133 16.930133 0 0 1-8.516267 2.286933z" opacity=".361" p-id="4764"></path><path d="M209.92 830.293333a17.066667 17.066667 0 0 1-12.117333-29.098666l120.32-121.173334a17.066667 17.066667 0 0 1 24.2176 24.029867l-120.32 121.1904a16.896 16.896 0 0 1-12.100267 5.051733z" opacity=".4" p-id="4765"></path></svg>
|
|
194
|
+
`;
|
|
195
|
+
function initNavigationBar(config, container) {
|
|
196
|
+
if (config.router.mode === 'multi')
|
|
197
|
+
return;
|
|
198
|
+
const navigationBar = document.createElement('div');
|
|
24
199
|
navigationBar.classList.add('taro-navigation-bar-no-icon');
|
|
25
|
-
const navigationBarBackBtn = document.createElement('
|
|
26
|
-
|
|
200
|
+
const navigationBarBackBtn = document.createElement('div');
|
|
201
|
+
navigationBarBackBtn.classList.add('taro-navigation-bar-back');
|
|
202
|
+
const navigationBarHomeBtn = document.createElement('div');
|
|
203
|
+
navigationBarHomeBtn.classList.add('taro-navigation-bar-home');
|
|
27
204
|
navigationBarBackBtn.innerHTML = back_svg_str;
|
|
28
205
|
navigationBarHomeBtn.innerHTML = home_svg_str;
|
|
29
|
-
const
|
|
206
|
+
const navigationBarTitleWrap = document.createElement('div');
|
|
207
|
+
navigationBarTitleWrap.classList.add('taro-navigation-bar-title-wrap');
|
|
208
|
+
const navigationBarLoading = document.createElement('div');
|
|
209
|
+
navigationBarLoading.classList.add('taro-navigation-bar-loading');
|
|
210
|
+
navigationBarLoading.innerHTML = loading_svg_str;
|
|
211
|
+
const navigationBarTitle = document.createElement('div');
|
|
212
|
+
navigationBarTitle.classList.add('taro-navigation-bar-title');
|
|
213
|
+
navigationBarTitleWrap.appendChild(navigationBarLoading);
|
|
214
|
+
navigationBarTitleWrap.appendChild(navigationBarTitle);
|
|
30
215
|
navigationBar.appendChild(navigationBarHomeBtn);
|
|
31
216
|
navigationBar.appendChild(navigationBarBackBtn);
|
|
32
|
-
navigationBar.appendChild(
|
|
217
|
+
navigationBar.appendChild(navigationBarTitleWrap);
|
|
33
218
|
navigationBar.id = 'taro-navigation-bar';
|
|
34
219
|
container.prepend(navigationBar);
|
|
220
|
+
loadNavigationBarStyle();
|
|
35
221
|
}
|
|
36
222
|
|
|
37
223
|
function initTabbar(config, history) {
|
|
@@ -79,8 +265,9 @@ class RouterConfig {
|
|
|
79
265
|
return this.router.mode || 'hash';
|
|
80
266
|
}
|
|
81
267
|
static get customRoutes() { return this.router.customRoutes || {}; }
|
|
268
|
+
// 这个方法不考虑 basename 和 customRoutes，只判断原始的 url 是否在 pages 中
|
|
82
269
|
static isPage(url = '') {
|
|
83
|
-
return this.pages.findIndex(e =>
|
|
270
|
+
return this.pages.findIndex(e => runtime.addLeadingSlash(e) === url) !== -1;
|
|
84
271
|
}
|
|
85
272
|
}
|
|
86
273
|
|
|
@@ -107,7 +294,7 @@ class MpaHistory {
|
|
|
107
294
|
}
|
|
108
295
|
parseUrl(to) {
|
|
109
296
|
let url = to.pathname || '';
|
|
110
|
-
if (RouterConfig.isPage(url)) {
|
|
297
|
+
if (RouterConfig.isPage(runtime.addLeadingSlash(url))) {
|
|
111
298
|
url += '.html';
|
|
112
299
|
}
|
|
113
300
|
if (to.search) {
|
|
@@ -290,11 +477,14 @@ function setMpaTitle(title) {
|
|
|
290
477
|
}
|
|
291
478
|
}
|
|
292
479
|
function setTitle(title) {
|
|
293
|
-
runtime.eventCenter.trigger('
|
|
480
|
+
runtime.eventCenter.trigger('__taroH5SetNavigationBarTitle', title);
|
|
294
481
|
}
|
|
295
482
|
function setNavigationBarStyle(option) {
|
|
296
483
|
runtime.eventCenter.trigger('__taroH5setNavigationBarColor', option);
|
|
297
484
|
}
|
|
485
|
+
function setNavigationBarLoading(loading) {
|
|
486
|
+
runtime.eventCenter.trigger('__taroH5setNavigationBarLoading', loading);
|
|
487
|
+
}
|
|
298
488
|
|
|
299
489
|
class RoutesAlias {
|
|
300
490
|
constructor() {
|
|
@@ -337,6 +527,7 @@ class RoutesAlias {
|
|
|
337
527
|
}
|
|
338
528
|
const routesAlias = new RoutesAlias();
|
|
339
529
|
|
|
530
|
+
const routeEvtChannel = shared.EventChannel.routeChannel;
|
|
340
531
|
function processNavigateUrl(option) {
|
|
341
532
|
var _a;
|
|
342
533
|
const pathPieces = history.parsePath(option.url);
|
|
@@ -345,13 +536,14 @@ function processNavigateUrl(option) {
|
|
|
345
536
|
const parts = routesAlias.getOrigin(exports.history.location.pathname).split('/');
|
|
346
537
|
parts.pop();
|
|
347
538
|
pathPieces.pathname.split('/').forEach((item) => {
|
|
348
|
-
if (item === '.')
|
|
539
|
+
if (item === '.')
|
|
349
540
|
return;
|
|
350
|
-
}
|
|
351
541
|
item === '..' ? parts.pop() : parts.push(item);
|
|
352
542
|
});
|
|
353
543
|
pathPieces.pathname = parts.join('/');
|
|
354
544
|
}
|
|
545
|
+
// 确保是 / 开头的路径
|
|
546
|
+
pathPieces.pathname = runtime.addLeadingSlash(pathPieces.pathname);
|
|
355
547
|
// 处理自定义路由
|
|
356
548
|
pathPieces.pathname = routesAlias.getAlias(runtime.addLeadingSlash(pathPieces.pathname));
|
|
357
549
|
// 处理 basename
|
|
@@ -368,6 +560,10 @@ function navigate(option, method) {
|
|
|
368
560
|
const { success, complete, fail } = option;
|
|
369
561
|
const unListen = exports.history.listen(() => {
|
|
370
562
|
const res = { errMsg: `${method}:ok` };
|
|
563
|
+
if (method === 'navigateTo') {
|
|
564
|
+
res.eventChannel = routeEvtChannel;
|
|
565
|
+
routeEvtChannel.addEvents(option.events);
|
|
566
|
+
}
|
|
371
567
|
success === null || success === void 0 ? void 0 : success(res);
|
|
372
568
|
complete === null || complete === void 0 ? void 0 : complete(res);
|
|
373
569
|
resolve(res);
|
|
@@ -377,21 +573,6 @@ function navigate(option, method) {
|
|
|
377
573
|
if ('url' in option) {
|
|
378
574
|
const pathPieces = processNavigateUrl(option);
|
|
379
575
|
const state = { timestamp: Date.now() };
|
|
380
|
-
if (pathPieces.pathname) {
|
|
381
|
-
const originPath = routesAlias.getOrigin(pathPieces.pathname);
|
|
382
|
-
const pagePath = originPath.startsWith('/') ? originPath.substring(1) : originPath;
|
|
383
|
-
if (!RouterConfig.pages.includes(pagePath)) {
|
|
384
|
-
const res = { errMsg: `${method}:fail page ${pagePath} is not found` };
|
|
385
|
-
fail === null || fail === void 0 ? void 0 : fail(res);
|
|
386
|
-
complete === null || complete === void 0 ? void 0 : complete(res);
|
|
387
|
-
if (fail || complete) {
|
|
388
|
-
return resolve(res);
|
|
389
|
-
}
|
|
390
|
-
else {
|
|
391
|
-
return reject(res);
|
|
392
|
-
}
|
|
393
|
-
}
|
|
394
|
-
}
|
|
395
576
|
if (method === 'navigateTo') {
|
|
396
577
|
exports.history.push(pathPieces, state);
|
|
397
578
|
}
|
|
@@ -507,137 +688,6 @@ function getOffset() {
|
|
|
507
688
|
}
|
|
508
689
|
}
|
|
509
690
|
|
|
510
|
-
/**
|
|
511
|
-
* 插入页面动画需要的样式
|
|
512
|
-
*/
|
|
513
|
-
function loadAnimateStyle(ms = 300) {
|
|
514
|
-
const css = `
|
|
515
|
-
body {
|
|
516
|
-
overflow: hidden; // 防止 iOS 页面滚动
|
|
517
|
-
}
|
|
518
|
-
.taro_router > .taro_page {
|
|
519
|
-
position: absolute;
|
|
520
|
-
left: 0;
|
|
521
|
-
top: 0;
|
|
522
|
-
width: 100%;
|
|
523
|
-
height: 100%;
|
|
524
|
-
background-color: #fff;
|
|
525
|
-
transform: translate(100%, 0);
|
|
526
|
-
transition: transform ${ms}ms;
|
|
527
|
-
z-index: 0;
|
|
528
|
-
}
|
|
529
|
-
|
|
530
|
-
.taro_router > .taro_page.taro_tabbar_page,
|
|
531
|
-
.taro_router > .taro_page.taro_page_show.taro_page_stationed {
|
|
532
|
-
transform: none;
|
|
533
|
-
}
|
|
534
|
-
|
|
535
|
-
.taro_router > .taro_page.taro_page_show {
|
|
536
|
-
transform: translate(0, 0);
|
|
537
|
-
}
|
|
538
|
-
`;
|
|
539
|
-
addStyle(css);
|
|
540
|
-
}
|
|
541
|
-
/**
|
|
542
|
-
* 插入路由相关样式
|
|
543
|
-
*/
|
|
544
|
-
function loadRouterStyle(enableTabBar, enableWindowScroll) {
|
|
545
|
-
const css = `
|
|
546
|
-
.taro_router {
|
|
547
|
-
position: relative;
|
|
548
|
-
width: 100%;
|
|
549
|
-
height: 100%;
|
|
550
|
-
}
|
|
551
|
-
|
|
552
|
-
.taro_page {
|
|
553
|
-
width: 100%;
|
|
554
|
-
height: 100%;
|
|
555
|
-
${enableWindowScroll ? '' : `
|
|
556
|
-
overflow-x: hidden;
|
|
557
|
-
overflow-y: scroll;
|
|
558
|
-
max-height: 100vh;
|
|
559
|
-
`}
|
|
560
|
-
}
|
|
561
|
-
${enableTabBar ? `
|
|
562
|
-
.taro-tabbar__container > .taro-tabbar__panel {
|
|
563
|
-
overflow: hidden;
|
|
564
|
-
}
|
|
565
|
-
|
|
566
|
-
.taro-tabbar__container > .taro-tabbar__panel > .taro_page.taro_tabbar_page {
|
|
567
|
-
max-height: calc(100vh - var(--taro-tabbar-height) - constant(safe-area-inset-bottom));
|
|
568
|
-
max-height: calc(100vh - var(--taro-tabbar-height) - env(safe-area-inset-bottom));
|
|
569
|
-
}
|
|
570
|
-
|
|
571
|
-
` : ''}
|
|
572
|
-
.taro_page_shade,
|
|
573
|
-
.taro_router > .taro_page.taro_page_show.taro_page_stationed:not(.taro_page_shade):not(.taro_tabbar_page):not(:last-child) {
|
|
574
|
-
display: none;
|
|
575
|
-
}
|
|
576
|
-
`;
|
|
577
|
-
addStyle(css);
|
|
578
|
-
}
|
|
579
|
-
/**
|
|
580
|
-
* 插入导航栏相关的样式
|
|
581
|
-
*/
|
|
582
|
-
function loadNavigationBarStyle() {
|
|
583
|
-
const css = `
|
|
584
|
-
.taro-navigation-bar-show {
|
|
585
|
-
background: white;
|
|
586
|
-
position: sticky;
|
|
587
|
-
z-index: 500;
|
|
588
|
-
top: 0;
|
|
589
|
-
padding-bottom: 8px;
|
|
590
|
-
padding-top: calc(env(safe-area-inset-top) + 8px);
|
|
591
|
-
display: flex;
|
|
592
|
-
justify-content: center;
|
|
593
|
-
align-items: center;
|
|
594
|
-
}
|
|
595
|
-
|
|
596
|
-
.taro-navigation-bar-hide {
|
|
597
|
-
display: none;
|
|
598
|
-
}
|
|
599
|
-
|
|
600
|
-
taro-navigation-bar-title {
|
|
601
|
-
font-size: 24px;
|
|
602
|
-
height: 24px;
|
|
603
|
-
line-height: 24px;
|
|
604
|
-
}
|
|
605
|
-
|
|
606
|
-
.taro-navigation-bar-no-icon > taro-navigation-bar-home {
|
|
607
|
-
display: none;
|
|
608
|
-
}
|
|
609
|
-
|
|
610
|
-
.taro-navigation-bar-no-icon > taro-navigation-bar-back {
|
|
611
|
-
display: none;
|
|
612
|
-
}
|
|
613
|
-
|
|
614
|
-
.taro-navigation-bar-home > taro-navigation-bar-home {
|
|
615
|
-
display: block;
|
|
616
|
-
left: 8px;
|
|
617
|
-
position: absolute;
|
|
618
|
-
width: 24px;
|
|
619
|
-
height: 24px;
|
|
620
|
-
}
|
|
621
|
-
|
|
622
|
-
.taro-navigation-bar-back > taro-navigation-bar-back {
|
|
623
|
-
display: block;
|
|
624
|
-
left: 8px;
|
|
625
|
-
position: absolute;
|
|
626
|
-
width: 24px;
|
|
627
|
-
height: 24px;
|
|
628
|
-
}
|
|
629
|
-
|
|
630
|
-
`;
|
|
631
|
-
addStyle(css);
|
|
632
|
-
}
|
|
633
|
-
function addStyle(css) {
|
|
634
|
-
if (!css)
|
|
635
|
-
return;
|
|
636
|
-
const style = document.createElement('style');
|
|
637
|
-
style.innerHTML = css;
|
|
638
|
-
document.getElementsByTagName('head')[0].appendChild(style);
|
|
639
|
-
}
|
|
640
|
-
|
|
641
691
|
/* eslint-disable dot-notation */
|
|
642
692
|
class MultiPageHandler {
|
|
643
693
|
constructor(config, history) {
|
|
@@ -793,16 +843,16 @@ const launchStampId$1 = createStampId$1();
|
|
|
793
843
|
* - 不支持路由动画
|
|
794
844
|
*/
|
|
795
845
|
function createMultiRouter(history, app, config, framework) {
|
|
796
|
-
var _a, _b, _c, _d, _e, _f;
|
|
797
846
|
return tslib.__awaiter(this, void 0, void 0, function* () {
|
|
847
|
+
var _a, _b, _c, _d, _e, _f;
|
|
798
848
|
if (typeof app.onUnhandledRejection === 'function') {
|
|
799
849
|
window.addEventListener('unhandledrejection', app.onUnhandledRejection);
|
|
800
850
|
}
|
|
801
|
-
runtime.eventCenter.on('
|
|
851
|
+
runtime.eventCenter.on('__taroH5SetNavigationBarTitle', setMpaTitle);
|
|
802
852
|
RouterConfig.config = config;
|
|
803
853
|
const handler = new MultiPageHandler(config, history);
|
|
804
854
|
const launchParam = {
|
|
805
|
-
path: config.pageName,
|
|
855
|
+
path: config.pageName, // 多页面模式没新开一个页面相当于重启，所以直接使用当前页面路径
|
|
806
856
|
query: handler.getQuery(launchStampId$1),
|
|
807
857
|
scene: 0,
|
|
808
858
|
shareTicket: '',
|
|
@@ -845,12 +895,17 @@ function createMultiRouter(history, app, config, framework) {
|
|
|
845
895
|
handler.load(page, pageConfig);
|
|
846
896
|
(_f = app.onShow) === null || _f === void 0 ? void 0 : _f.call(app, launchParam);
|
|
847
897
|
window.addEventListener('visibilitychange', () => {
|
|
848
|
-
var _a, _b;
|
|
898
|
+
var _a, _b, _c;
|
|
899
|
+
const currentPath = ((_a = runtime.Current.page) === null || _a === void 0 ? void 0 : _a.path) || '';
|
|
900
|
+
const path = currentPath.substring(0, currentPath.indexOf('?'));
|
|
901
|
+
const param = {};
|
|
902
|
+
// app的 onShow/onHide 生命周期的路径信息为当前页面的路径
|
|
903
|
+
Object.assign(param, launchParam, { path });
|
|
849
904
|
if (document.visibilityState === 'visible') {
|
|
850
|
-
(
|
|
905
|
+
(_b = app.onShow) === null || _b === void 0 ? void 0 : _b.call(app, param);
|
|
851
906
|
}
|
|
852
907
|
else {
|
|
853
|
-
(
|
|
908
|
+
(_c = app.onHide) === null || _c === void 0 ? void 0 : _c.call(app, param);
|
|
854
909
|
}
|
|
855
910
|
});
|
|
856
911
|
});
|
|
@@ -862,10 +917,12 @@ class NavigationBarHandler {
|
|
|
862
917
|
this.cache = {};
|
|
863
918
|
this.pageContext = pageContext;
|
|
864
919
|
this.init();
|
|
865
|
-
|
|
866
|
-
runtime.eventCenter.on('__taroH5SetNavigationTitle', (title) => {
|
|
920
|
+
runtime.eventCenter.on('__taroH5SetNavigationBarTitle', (title) => {
|
|
867
921
|
this.setTitle(title);
|
|
868
922
|
});
|
|
923
|
+
runtime.eventCenter.on('__taroH5setNavigationBarLoading', (loading) => {
|
|
924
|
+
this.setNavigationLoading(loading);
|
|
925
|
+
});
|
|
869
926
|
runtime.eventCenter.on('__taroH5setNavigationBarColor', ({ backgroundColor, frontColor }) => {
|
|
870
927
|
if (typeof backgroundColor === 'string')
|
|
871
928
|
this.setNavigationBarBackground(backgroundColor);
|
|
@@ -874,7 +931,7 @@ class NavigationBarHandler {
|
|
|
874
931
|
});
|
|
875
932
|
}
|
|
876
933
|
toHomeFn() {
|
|
877
|
-
reLaunch({ url: this.pageContext.
|
|
934
|
+
reLaunch({ url: this.pageContext.originHomePage });
|
|
878
935
|
}
|
|
879
936
|
backFn() {
|
|
880
937
|
navigateBack();
|
|
@@ -883,19 +940,24 @@ class NavigationBarHandler {
|
|
|
883
940
|
var _a;
|
|
884
941
|
if (!this.navigationBarElement)
|
|
885
942
|
return null;
|
|
886
|
-
return (_a = this.navigationBarElement.
|
|
943
|
+
return (_a = this.navigationBarElement.getElementsByClassName('taro-navigation-bar-home')) === null || _a === void 0 ? void 0 : _a[0];
|
|
887
944
|
}
|
|
888
945
|
get backBtnElement() {
|
|
889
946
|
var _a;
|
|
890
947
|
if (!this.navigationBarElement)
|
|
891
948
|
return null;
|
|
892
|
-
return (_a = this.navigationBarElement.
|
|
949
|
+
return (_a = this.navigationBarElement.getElementsByClassName('taro-navigation-bar-back')) === null || _a === void 0 ? void 0 : _a[0];
|
|
893
950
|
}
|
|
894
951
|
get titleElement() {
|
|
895
952
|
var _a;
|
|
896
953
|
if (!this.navigationBarElement)
|
|
897
954
|
return null;
|
|
898
|
-
return (_a = this.navigationBarElement.
|
|
955
|
+
return (_a = this.navigationBarElement.getElementsByClassName('taro-navigation-bar-title')) === null || _a === void 0 ? void 0 : _a[0];
|
|
956
|
+
}
|
|
957
|
+
get loadingElement() {
|
|
958
|
+
if (!this.navigationBarElement)
|
|
959
|
+
return null;
|
|
960
|
+
return this.navigationBarElement.getElementsByClassName('taro-navigation-bar-loading')[0];
|
|
899
961
|
}
|
|
900
962
|
init() {
|
|
901
963
|
var _a, _b;
|
|
@@ -906,8 +968,7 @@ class NavigationBarHandler {
|
|
|
906
968
|
(_b = this.backBtnElement) === null || _b === void 0 ? void 0 : _b.addEventListener('click', this.backFn.bind(this));
|
|
907
969
|
}
|
|
908
970
|
setNavigationBarElement() {
|
|
909
|
-
|
|
910
|
-
this.navigationBarElement = (_a = document.getElementsByTagName('taro-navigation-bar-wrap')) === null || _a === void 0 ? void 0 : _a[0];
|
|
971
|
+
this.navigationBarElement = document.getElementById('taro-navigation-bar');
|
|
911
972
|
}
|
|
912
973
|
load() {
|
|
913
974
|
this.setCacheValue();
|
|
@@ -916,9 +977,10 @@ class NavigationBarHandler {
|
|
|
916
977
|
this.setFnBtnState();
|
|
917
978
|
this.setNavigationBarBackground();
|
|
918
979
|
this.setNavigationBarTextStyle();
|
|
980
|
+
this.setNavigationLoading();
|
|
919
981
|
}
|
|
920
982
|
setCacheValue() {
|
|
921
|
-
const currentPage = this.pageContext.
|
|
983
|
+
const currentPage = this.pageContext.originPathname;
|
|
922
984
|
if (typeof this.cache[currentPage] !== 'object') {
|
|
923
985
|
this.cache[currentPage] = {};
|
|
924
986
|
}
|
|
@@ -935,11 +997,46 @@ class NavigationBarHandler {
|
|
|
935
997
|
this.fnBtnToggleToHome();
|
|
936
998
|
}
|
|
937
999
|
}
|
|
1000
|
+
shiftLoadingState(show) {
|
|
1001
|
+
if (!this.loadingElement)
|
|
1002
|
+
return;
|
|
1003
|
+
if (show) {
|
|
1004
|
+
this.loadingElement.classList.add('taro-navigation-bar-loading-show');
|
|
1005
|
+
}
|
|
1006
|
+
else {
|
|
1007
|
+
this.loadingElement.classList.remove('taro-navigation-bar-loading-show');
|
|
1008
|
+
}
|
|
1009
|
+
}
|
|
1010
|
+
setNavigationLoading(show) {
|
|
1011
|
+
var _a;
|
|
1012
|
+
if (!this.navigationBarElement)
|
|
1013
|
+
return;
|
|
1014
|
+
const currentPage = this.pageContext.originPathname;
|
|
1015
|
+
let isShow;
|
|
1016
|
+
if (typeof show === 'boolean') {
|
|
1017
|
+
isShow = show;
|
|
1018
|
+
this.cache[currentPage] &&
|
|
1019
|
+
(this.cache[currentPage].loading = isShow);
|
|
1020
|
+
}
|
|
1021
|
+
else {
|
|
1022
|
+
const cacheValue = (_a = this.cache[currentPage]) === null || _a === void 0 ? void 0 : _a.loading;
|
|
1023
|
+
if (typeof cacheValue === 'boolean') {
|
|
1024
|
+
isShow = cacheValue;
|
|
1025
|
+
}
|
|
1026
|
+
else {
|
|
1027
|
+
// 默认值为 false
|
|
1028
|
+
isShow = false;
|
|
1029
|
+
this.cache[currentPage] &&
|
|
1030
|
+
(this.cache[currentPage].loading = isShow);
|
|
1031
|
+
}
|
|
1032
|
+
}
|
|
1033
|
+
this.shiftLoadingState(isShow);
|
|
1034
|
+
}
|
|
938
1035
|
setNavigationBarBackground(backgroundColor) {
|
|
939
1036
|
var _a, _b, _c;
|
|
940
1037
|
if (!this.navigationBarElement)
|
|
941
1038
|
return;
|
|
942
|
-
const currentPage = this.pageContext.
|
|
1039
|
+
const currentPage = this.pageContext.originPathname;
|
|
943
1040
|
let color;
|
|
944
1041
|
if (typeof backgroundColor === 'string') {
|
|
945
1042
|
color = backgroundColor;
|
|
@@ -963,7 +1060,7 @@ class NavigationBarHandler {
|
|
|
963
1060
|
var _a, _b, _c;
|
|
964
1061
|
if (!this.navigationBarElement)
|
|
965
1062
|
return;
|
|
966
|
-
const currentPage = this.pageContext.
|
|
1063
|
+
const currentPage = this.pageContext.originPathname;
|
|
967
1064
|
let color;
|
|
968
1065
|
if (typeof fontColor === 'string') {
|
|
969
1066
|
color = fontColor;
|
|
@@ -985,7 +1082,7 @@ class NavigationBarHandler {
|
|
|
985
1082
|
}
|
|
986
1083
|
setTitle(title) {
|
|
987
1084
|
var _a, _b, _c;
|
|
988
|
-
const currentPage = this.pageContext.
|
|
1085
|
+
const currentPage = this.pageContext.originPathname;
|
|
989
1086
|
let proceedTitle;
|
|
990
1087
|
if (typeof title === 'string') {
|
|
991
1088
|
proceedTitle = title;
|
|
@@ -1019,23 +1116,25 @@ class NavigationBarHandler {
|
|
|
1019
1116
|
fnBtnToggleToHome() {
|
|
1020
1117
|
if (!this.navigationBarElement)
|
|
1021
1118
|
return;
|
|
1022
|
-
this.navigationBarElement.classList.add('taro-navigation-bar-home');
|
|
1023
|
-
this.navigationBarElement.classList.remove('taro-navigation-bar-back');
|
|
1119
|
+
this.navigationBarElement.classList.add('taro-navigation-bar-home-icon');
|
|
1120
|
+
this.navigationBarElement.classList.remove('taro-navigation-bar-back-icon');
|
|
1024
1121
|
}
|
|
1025
1122
|
fnBtnToggleToBack() {
|
|
1026
1123
|
if (!this.navigationBarElement)
|
|
1027
1124
|
return;
|
|
1028
|
-
this.navigationBarElement.classList.remove('taro-navigation-bar-home');
|
|
1029
|
-
this.navigationBarElement.classList.add('taro-navigation-bar-back');
|
|
1125
|
+
this.navigationBarElement.classList.remove('taro-navigation-bar-home-icon');
|
|
1126
|
+
this.navigationBarElement.classList.add('taro-navigation-bar-back-icon');
|
|
1030
1127
|
}
|
|
1031
1128
|
fnBtnToggleToNone() {
|
|
1032
1129
|
if (!this.navigationBarElement)
|
|
1033
1130
|
return;
|
|
1034
|
-
this.navigationBarElement.classList.remove('taro-navigation-bar-home');
|
|
1035
|
-
this.navigationBarElement.classList.remove('taro-navigation-bar-back');
|
|
1131
|
+
this.navigationBarElement.classList.remove('taro-navigation-bar-home-icon');
|
|
1132
|
+
this.navigationBarElement.classList.remove('taro-navigation-bar-back-icon');
|
|
1036
1133
|
}
|
|
1037
1134
|
setNavigationBarVisible(show) {
|
|
1038
1135
|
var _a, _b;
|
|
1136
|
+
if (!this.navigationBarElement)
|
|
1137
|
+
return;
|
|
1039
1138
|
let shouldShow;
|
|
1040
1139
|
if (typeof show === 'boolean') {
|
|
1041
1140
|
shouldShow = show;
|
|
@@ -1064,6 +1163,7 @@ class PageHandler {
|
|
|
1064
1163
|
this.defaultAnimation = { duration: 300, delay: 50 };
|
|
1065
1164
|
this.config = config;
|
|
1066
1165
|
this.homePage = runtime.getHomePage(this.routes[0].path, this.basename, this.customRoutes, this.config.entryPagePath);
|
|
1166
|
+
this.originHomePage = this.config.entryPagePath || this.routes[0].path || this.basename;
|
|
1067
1167
|
this.mount();
|
|
1068
1168
|
this.navigationBarHandler = new NavigationBarHandler(this);
|
|
1069
1169
|
}
|
|
@@ -1097,14 +1197,14 @@ class PageHandler {
|
|
|
1097
1197
|
}
|
|
1098
1198
|
set pathname(p) { this.router.pathname = p; }
|
|
1099
1199
|
get pathname() { return this.router.pathname; }
|
|
1200
|
+
// Note: 把 pathname 转换为原始路径，主要是处理 customRoutes 和 basename
|
|
1201
|
+
get originPathname() { return routesAlias.getOrigin(runtime.addLeadingSlash(runtime.stripBasename(this.pathname, this.basename))); }
|
|
1100
1202
|
get basename() { return this.router.basename || ''; }
|
|
1101
1203
|
get pageConfig() {
|
|
1102
|
-
const routePath = runtime.addLeadingSlash(runtime.stripBasename(this.pathname, this.basename));
|
|
1103
1204
|
const homePage = runtime.addLeadingSlash(this.homePage);
|
|
1104
1205
|
return this.routes.find(r => {
|
|
1105
|
-
var _a;
|
|
1106
1206
|
const pagePath = runtime.addLeadingSlash(r.path);
|
|
1107
|
-
return [pagePath, homePage].includes(
|
|
1207
|
+
return [pagePath, homePage].includes(this.originPathname);
|
|
1108
1208
|
});
|
|
1109
1209
|
}
|
|
1110
1210
|
isTabBar(pathname) {
|
|
@@ -1294,24 +1394,35 @@ class PageHandler {
|
|
|
1294
1394
|
});
|
|
1295
1395
|
}
|
|
1296
1396
|
}
|
|
1297
|
-
hide(page) {
|
|
1298
|
-
var _a;
|
|
1397
|
+
hide(page, animation = false) {
|
|
1398
|
+
var _a, _b, _c, _d, _e, _f, _g;
|
|
1299
1399
|
if (!page)
|
|
1300
1400
|
return;
|
|
1301
1401
|
// NOTE: 修复多页并发问题，此处可能因为路由跳转过快，执行时页面可能还没有创建成功
|
|
1302
1402
|
const pageEl = this.getPageContainer(page);
|
|
1303
1403
|
if (pageEl) {
|
|
1304
|
-
if (
|
|
1305
|
-
|
|
1306
|
-
|
|
1307
|
-
|
|
1404
|
+
if (animation) {
|
|
1405
|
+
if (this.hideTimer) {
|
|
1406
|
+
clearTimeout(this.hideTimer);
|
|
1407
|
+
this.hideTimer = null;
|
|
1408
|
+
(_c = (_b = (_a = this.lastHidePage) === null || _a === void 0 ? void 0 : _a.classList) === null || _b === void 0 ? void 0 : _b.add) === null || _c === void 0 ? void 0 : _c.call(_b, 'taro_page_shade');
|
|
1409
|
+
}
|
|
1410
|
+
this.lastHidePage = pageEl;
|
|
1411
|
+
this.hideTimer = setTimeout(() => {
|
|
1412
|
+
this.hideTimer = null;
|
|
1413
|
+
pageEl.classList.add('taro_page_shade');
|
|
1414
|
+
}, this.animationDuration + this.animationDelay);
|
|
1415
|
+
(_d = page.onHide) === null || _d === void 0 ? void 0 : _d.call(page);
|
|
1308
1416
|
}
|
|
1309
|
-
|
|
1310
|
-
|
|
1311
|
-
|
|
1417
|
+
else {
|
|
1418
|
+
if (this.hideTimer) {
|
|
1419
|
+
clearTimeout(this.hideTimer);
|
|
1420
|
+
this.hideTimer = null;
|
|
1421
|
+
(_g = (_f = (_e = this.lastHidePage) === null || _e === void 0 ? void 0 : _e.classList) === null || _f === void 0 ? void 0 : _f.add) === null || _g === void 0 ? void 0 : _g.call(_f, 'taro_page_shade');
|
|
1422
|
+
}
|
|
1312
1423
|
pageEl.classList.add('taro_page_shade');
|
|
1313
|
-
|
|
1314
|
-
|
|
1424
|
+
this.lastHidePage = pageEl;
|
|
1425
|
+
}
|
|
1315
1426
|
}
|
|
1316
1427
|
else {
|
|
1317
1428
|
setTimeout(() => this.hide(page), 0);
|
|
@@ -1403,10 +1514,10 @@ function createRouter(history$1, app, config, framework) {
|
|
|
1403
1514
|
runtime.eventCenter.trigger('__taroRouterLaunch', launchParam);
|
|
1404
1515
|
(_a = app.onLaunch) === null || _a === void 0 ? void 0 : _a.call(app, launchParam);
|
|
1405
1516
|
app.onError && window.addEventListener('error', e => { var _a; return (_a = app.onError) === null || _a === void 0 ? void 0 : _a.call(app, e.message); });
|
|
1406
|
-
const render = (
|
|
1407
|
-
var
|
|
1517
|
+
const render = (_c) => tslib.__awaiter(this, [_c], void 0, function* ({ location, action }) {
|
|
1518
|
+
var _d, _e, _f, _g, _h, _j, _k, _l;
|
|
1408
1519
|
handler.pathname = decodeURI(location.pathname);
|
|
1409
|
-
if ((
|
|
1520
|
+
if ((_d = window.__taroAppConfig) === null || _d === void 0 ? void 0 : _d.usingWindowScroll)
|
|
1410
1521
|
window.scrollTo(0, 0);
|
|
1411
1522
|
runtime.eventCenter.trigger('__taroRouterChange', {
|
|
1412
1523
|
toLocation: {
|
|
@@ -1425,7 +1536,7 @@ function createRouter(history$1, app, config, framework) {
|
|
|
1425
1536
|
path: handler.pathname,
|
|
1426
1537
|
query: handler.getQuery(createStampId()),
|
|
1427
1538
|
};
|
|
1428
|
-
(
|
|
1539
|
+
(_e = app.onPageNotFound) === null || _e === void 0 ? void 0 : _e.call(app, notFoundEvent);
|
|
1429
1540
|
runtime.eventCenter.trigger('__taroRouterNotFound', notFoundEvent);
|
|
1430
1541
|
}
|
|
1431
1542
|
else if (/Loading hot update .* failed./.test(error.message)) {
|
|
@@ -1439,10 +1550,10 @@ function createRouter(history$1, app, config, framework) {
|
|
|
1439
1550
|
if (!element)
|
|
1440
1551
|
return;
|
|
1441
1552
|
const pageConfig = handler.pageConfig;
|
|
1442
|
-
let enablePullDownRefresh = ((
|
|
1443
|
-
let navigationStyle = ((
|
|
1444
|
-
let navigationBarTextStyle = ((
|
|
1445
|
-
let navigationBarBackgroundColor = ((
|
|
1553
|
+
let enablePullDownRefresh = ((_f = config === null || config === void 0 ? void 0 : config.window) === null || _f === void 0 ? void 0 : _f.enablePullDownRefresh) || false;
|
|
1554
|
+
let navigationStyle = ((_g = config === null || config === void 0 ? void 0 : config.window) === null || _g === void 0 ? void 0 : _g.navigationStyle) || 'default';
|
|
1555
|
+
let navigationBarTextStyle = ((_h = config === null || config === void 0 ? void 0 : config.window) === null || _h === void 0 ? void 0 : _h.navigationBarTextStyle) || 'white';
|
|
1556
|
+
let navigationBarBackgroundColor = ((_j = config === null || config === void 0 ? void 0 : config.window) === null || _j === void 0 ? void 0 : _j.navigationBarBackgroundColor) || '#000000';
|
|
1446
1557
|
if (pageConfig) {
|
|
1447
1558
|
if (typeof pageConfig.enablePullDownRefresh === 'boolean') {
|
|
1448
1559
|
enablePullDownRefresh = pageConfig.enablePullDownRefresh;
|
|
@@ -1460,7 +1571,7 @@ function createRouter(history$1, app, config, framework) {
|
|
|
1460
1571
|
runtime.eventCenter.trigger('__taroSetNavigationStyle', navigationStyle, navigationBarTextStyle, navigationBarBackgroundColor);
|
|
1461
1572
|
const currentPage = runtime.Current.page;
|
|
1462
1573
|
const pathname = handler.pathname;
|
|
1463
|
-
const methodName = (
|
|
1574
|
+
const methodName = (_k = stacks.method) !== null && _k !== void 0 ? _k : '';
|
|
1464
1575
|
const cacheTabs = stacks.getTabs();
|
|
1465
1576
|
let shouldLoad = false;
|
|
1466
1577
|
stacks.method = '';
|
|
@@ -1479,6 +1590,7 @@ function createRouter(history$1, app, config, framework) {
|
|
|
1479
1590
|
if (handler.isSamePage(currentPage))
|
|
1480
1591
|
return;
|
|
1481
1592
|
if (handler.isTabBar(currentPage.path)) {
|
|
1593
|
+
// NOTE: 从 tabBar 页面切换到 tabBar 页面
|
|
1482
1594
|
handler.hide(currentPage);
|
|
1483
1595
|
stacks.pushTab(currentPage.path.split('?')[0]);
|
|
1484
1596
|
}
|
|
@@ -1522,11 +1634,11 @@ function createRouter(history$1, app, config, framework) {
|
|
|
1522
1634
|
shouldLoad = true;
|
|
1523
1635
|
}
|
|
1524
1636
|
else if (action === 'PUSH') {
|
|
1525
|
-
handler.hide(currentPage);
|
|
1637
|
+
handler.hide(currentPage, true);
|
|
1526
1638
|
shouldLoad = true;
|
|
1527
1639
|
}
|
|
1528
1640
|
if (shouldLoad || stacks.length < 1) {
|
|
1529
|
-
const el = (
|
|
1641
|
+
const el = (_l = element.default) !== null && _l !== void 0 ? _l : element;
|
|
1530
1642
|
const loadConfig = Object.assign({}, pageConfig);
|
|
1531
1643
|
const stacksIndex = stacks.length;
|
|
1532
1644
|
delete loadConfig['path'];
|
|
@@ -1552,12 +1664,23 @@ function createRouter(history$1, app, config, framework) {
|
|
|
1552
1664
|
render({ location: history$1.location, action: history.Action.Push });
|
|
1553
1665
|
(_b = app.onShow) === null || _b === void 0 ? void 0 : _b.call(app, launchParam);
|
|
1554
1666
|
window.addEventListener('visibilitychange', () => {
|
|
1555
|
-
var _a, _b;
|
|
1667
|
+
var _a, _b, _c, _d, _e, _f, _g;
|
|
1668
|
+
const currentPath = ((_a = runtime.Current.page) === null || _a === void 0 ? void 0 : _a.path) || '';
|
|
1669
|
+
const path = currentPath.substring(0, currentPath.indexOf('?'));
|
|
1670
|
+
const param = {};
|
|
1671
|
+
// app的 onShow/onHide 生命周期的路径信息为当前页面的路径
|
|
1672
|
+
Object.assign(param, launchParam, { path });
|
|
1556
1673
|
if (document.visibilityState === 'visible') {
|
|
1557
|
-
(
|
|
1674
|
+
(_b = app.onShow) === null || _b === void 0 ? void 0 : _b.call(app, param);
|
|
1675
|
+
// 单页面app显示后一刻会触发当前 page.onShow 生命周期函数
|
|
1676
|
+
(_d = (_c = runtime.Current.page) === null || _c === void 0 ? void 0 : _c.onShow) === null || _d === void 0 ? void 0 : _d.call(_c);
|
|
1558
1677
|
}
|
|
1559
1678
|
else {
|
|
1560
|
-
|
|
1679
|
+
// 单页面app隐藏前一刻会触发当前 page.onHide 生命周期函数
|
|
1680
|
+
if ((_e = runtime.Current.page) === null || _e === void 0 ? void 0 : _e.path) {
|
|
1681
|
+
runtime.safeExecute((_f = runtime.Current.page) === null || _f === void 0 ? void 0 : _f.path, 'onHide');
|
|
1682
|
+
}
|
|
1683
|
+
(_g = app.onHide) === null || _g === void 0 ? void 0 : _g.call(app, param);
|
|
1561
1684
|
}
|
|
1562
1685
|
});
|
|
1563
1686
|
return history$1.listen(render);
|
|
@@ -1575,7 +1698,7 @@ function handleAppMount(config, _, appId = config.appId || 'app') {
|
|
|
1575
1698
|
app.classList.add('taro_router');
|
|
1576
1699
|
if (!isPosition)
|
|
1577
1700
|
appWrapper.appendChild(app);
|
|
1578
|
-
initNavigationBar(appWrapper);
|
|
1701
|
+
initNavigationBar(config, appWrapper);
|
|
1579
1702
|
}
|
|
1580
1703
|
function handleAppMountWithTabbar(config, history, appId = config.appId || 'app') {
|
|
1581
1704
|
let app = document.getElementById(appId);
|
|
@@ -1601,14 +1724,14 @@ function handleAppMountWithTabbar(config, history, appId = config.appId || 'app'
|
|
|
1601
1724
|
appWrapper.replaceChild(container, app);
|
|
1602
1725
|
}
|
|
1603
1726
|
initTabbar(config, history);
|
|
1604
|
-
initNavigationBar(container);
|
|
1727
|
+
initNavigationBar(config, container);
|
|
1605
1728
|
}
|
|
1606
1729
|
|
|
1607
|
-
Object.defineProperty(exports,
|
|
1730
|
+
Object.defineProperty(exports, "createBrowserHistory", {
|
|
1608
1731
|
enumerable: true,
|
|
1609
1732
|
get: function () { return history.createBrowserHistory; }
|
|
1610
1733
|
});
|
|
1611
|
-
Object.defineProperty(exports,
|
|
1734
|
+
Object.defineProperty(exports, "createHashHistory", {
|
|
1612
1735
|
enumerable: true,
|
|
1613
1736
|
get: function () { return history.createHashHistory; }
|
|
1614
1737
|
});
|
|
@@ -1629,6 +1752,7 @@ exports.routesAlias = routesAlias;
|
|
|
1629
1752
|
exports.setHistory = setHistory;
|
|
1630
1753
|
exports.setHistoryMode = setHistoryMode;
|
|
1631
1754
|
exports.setMpaTitle = setMpaTitle;
|
|
1755
|
+
exports.setNavigationBarLoading = setNavigationBarLoading;
|
|
1632
1756
|
exports.setNavigationBarStyle = setNavigationBarStyle;
|
|
1633
1757
|
exports.setTitle = setTitle;
|
|
1634
1758
|
exports.switchTab = switchTab;
|