@tarojs/router 3.5.0-alpha.1 → 3.5.0-alpha.4
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/dist/api.js +46 -34
- package/dist/history.js +6 -5
- package/dist/index.cjs.js +224 -172
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +974 -0
- package/dist/index.esm.js.map +1 -0
- package/dist/router/index.js +0 -1
- package/dist/router/mpa.js +47 -36
- package/dist/router/multi-page.js +21 -15
- package/dist/router/page.js +49 -38
- package/dist/router/spa.js +26 -18
- package/dist/router/stack.js +5 -3
- package/dist/tabbar.js +1 -1
- package/dist/utils.js +26 -22
- package/package.json +9 -8
- package/types/api.d.ts +15 -0
- package/types/history.d.ts +8 -0
- package/types/router.d.ts +32 -0
- package/types/index.d.ts +0 -288
package/dist/index.cjs.js
CHANGED
|
@@ -17,7 +17,31 @@ const addLeadingSlash = (url = '') => (url.charAt(0) === '/' ? url : '/' + url);
|
|
|
17
17
|
const hasBasename = (path = '', prefix = '') => new RegExp('^' + prefix + '(\\/|\\?|#|$)', 'i').test(path) || path === prefix;
|
|
18
18
|
const stripBasename = (path = '', prefix = '') => hasBasename(path, prefix) ? path.substr(prefix.length) : path;
|
|
19
19
|
class RoutesAlias {
|
|
20
|
-
|
|
20
|
+
constructor() {
|
|
21
|
+
this.conf = [];
|
|
22
|
+
this.getConfig = (url = '') => {
|
|
23
|
+
const customRoute = this.conf.filter((arr) => {
|
|
24
|
+
return arr.includes(url);
|
|
25
|
+
});
|
|
26
|
+
return customRoute[0];
|
|
27
|
+
};
|
|
28
|
+
this.getOrigin = (url = '') => {
|
|
29
|
+
var _a;
|
|
30
|
+
return ((_a = this.getConfig(url)) === null || _a === void 0 ? void 0 : _a[0]) || url;
|
|
31
|
+
};
|
|
32
|
+
this.getAlias = (url = '') => {
|
|
33
|
+
var _a;
|
|
34
|
+
return ((_a = this.getConfig(url)) === null || _a === void 0 ? void 0 : _a[1]) || url;
|
|
35
|
+
};
|
|
36
|
+
this.getAll = (url = '') => {
|
|
37
|
+
return this.conf
|
|
38
|
+
.filter((arr) => arr.includes(url))
|
|
39
|
+
.reduceRight((p, a) => {
|
|
40
|
+
p.unshift(a[1]);
|
|
41
|
+
return p;
|
|
42
|
+
}, []);
|
|
43
|
+
};
|
|
44
|
+
}
|
|
21
45
|
set(customRoutes = {}) {
|
|
22
46
|
for (let key in customRoutes) {
|
|
23
47
|
const path = customRoutes[key];
|
|
@@ -25,36 +49,15 @@ class RoutesAlias {
|
|
|
25
49
|
if (typeof path === 'string') {
|
|
26
50
|
this.conf.push([key, addLeadingSlash(path)]);
|
|
27
51
|
}
|
|
28
|
-
else if (path
|
|
52
|
+
else if ((path === null || path === void 0 ? void 0 : path.length) > 0) {
|
|
29
53
|
this.conf.push(...path.map(p => [key, addLeadingSlash(p)]));
|
|
30
54
|
}
|
|
31
55
|
}
|
|
32
56
|
}
|
|
33
|
-
getConfig = (url = '') => {
|
|
34
|
-
const customRoute = this.conf.filter((arr) => {
|
|
35
|
-
return arr.includes(url);
|
|
36
|
-
});
|
|
37
|
-
return customRoute[0];
|
|
38
|
-
};
|
|
39
|
-
getOrigin = (url = '') => {
|
|
40
|
-
return this.getConfig(url)?.[0] || url;
|
|
41
|
-
};
|
|
42
|
-
getAlias = (url = '') => {
|
|
43
|
-
return this.getConfig(url)?.[1] || url;
|
|
44
|
-
};
|
|
45
|
-
getAll = (url = '') => {
|
|
46
|
-
return this.conf
|
|
47
|
-
.filter((arr) => arr.includes(url))
|
|
48
|
-
.reduceRight((p, a) => {
|
|
49
|
-
p.unshift(a[1]);
|
|
50
|
-
return p;
|
|
51
|
-
}, []);
|
|
52
|
-
};
|
|
53
57
|
}
|
|
54
58
|
const routesAlias = new RoutesAlias();
|
|
55
59
|
|
|
56
60
|
class RouterConfig {
|
|
57
|
-
static __config;
|
|
58
61
|
static set config(e) {
|
|
59
62
|
this.__config = e;
|
|
60
63
|
}
|
|
@@ -79,7 +82,12 @@ class RouterConfig {
|
|
|
79
82
|
exports.history = void 0;
|
|
80
83
|
let basename = '/';
|
|
81
84
|
class MpaHistory {
|
|
82
|
-
|
|
85
|
+
constructor() {
|
|
86
|
+
this.back = window.history.back;
|
|
87
|
+
this.forward = window.history.forward;
|
|
88
|
+
this.pushState = this.eventState('pushState');
|
|
89
|
+
this.replaceState = this.eventState('replaceState');
|
|
90
|
+
}
|
|
83
91
|
get location() {
|
|
84
92
|
return {
|
|
85
93
|
pathname: window.location.pathname,
|
|
@@ -116,8 +124,6 @@ class MpaHistory {
|
|
|
116
124
|
go(delta) {
|
|
117
125
|
window.history.go(delta);
|
|
118
126
|
}
|
|
119
|
-
back = window.history.back;
|
|
120
|
-
forward = window.history.forward;
|
|
121
127
|
listen(listener) {
|
|
122
128
|
function callback(e) {
|
|
123
129
|
if (e.action === 'pushState') {
|
|
@@ -139,8 +145,6 @@ class MpaHistory {
|
|
|
139
145
|
block(_blocker) {
|
|
140
146
|
throw new Error('Method not implemented.');
|
|
141
147
|
}
|
|
142
|
-
pushState = this.eventState('pushState');
|
|
143
|
-
replaceState = this.eventState('replaceState');
|
|
144
148
|
eventState(action) {
|
|
145
149
|
return (data, unused, url) => {
|
|
146
150
|
const wrapper = window.history[action](data, unused, url);
|
|
@@ -174,9 +178,36 @@ function prependBasename(url = '') {
|
|
|
174
178
|
return basename.replace(/\/$/, '') + '/' + url.replace(/^\//, '');
|
|
175
179
|
}
|
|
176
180
|
|
|
181
|
+
/*! *****************************************************************************
|
|
182
|
+
Copyright (c) Microsoft Corporation.
|
|
183
|
+
|
|
184
|
+
Permission to use, copy, modify, and/or distribute this software for any
|
|
185
|
+
purpose with or without fee is hereby granted.
|
|
186
|
+
|
|
187
|
+
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
|
|
188
|
+
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
|
|
189
|
+
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
|
|
190
|
+
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
|
|
191
|
+
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
|
|
192
|
+
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
|
|
193
|
+
PERFORMANCE OF THIS SOFTWARE.
|
|
194
|
+
***************************************************************************** */
|
|
195
|
+
|
|
196
|
+
function __awaiter(thisArg, _arguments, P, generator) {
|
|
197
|
+
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
198
|
+
return new (P || (P = Promise))(function (resolve, reject) {
|
|
199
|
+
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
200
|
+
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
201
|
+
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
202
|
+
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
203
|
+
});
|
|
204
|
+
}
|
|
205
|
+
|
|
177
206
|
class Stacks {
|
|
178
|
-
|
|
179
|
-
|
|
207
|
+
constructor() {
|
|
208
|
+
this.stacks = [];
|
|
209
|
+
this.backDelta = 0;
|
|
210
|
+
}
|
|
180
211
|
set delta(delta) {
|
|
181
212
|
if (delta > 0) {
|
|
182
213
|
this.backDelta = delta;
|
|
@@ -205,7 +236,7 @@ class Stacks {
|
|
|
205
236
|
}
|
|
206
237
|
getLastIndex(pathname, stateWith = 1) {
|
|
207
238
|
const list = [...this.stacks].reverse();
|
|
208
|
-
return list.findIndex((page, i) => i >= stateWith && page.path
|
|
239
|
+
return list.findIndex((page, i) => { var _a; return i >= stateWith && ((_a = page.path) === null || _a === void 0 ? void 0 : _a.replace(/\?.*/g, '')) === pathname; });
|
|
209
240
|
}
|
|
210
241
|
getDelta(pathname) {
|
|
211
242
|
if (this.backDelta >= 1) {
|
|
@@ -232,9 +263,10 @@ class Stacks {
|
|
|
232
263
|
const stacks = new Stacks();
|
|
233
264
|
|
|
234
265
|
function processNavigateUrl(option) {
|
|
266
|
+
var _a;
|
|
235
267
|
const pathPieces = history.parsePath(option.url);
|
|
236
268
|
// 处理相对路径
|
|
237
|
-
if (pathPieces.pathname
|
|
269
|
+
if ((_a = pathPieces.pathname) === null || _a === void 0 ? void 0 : _a.includes('./')) {
|
|
238
270
|
const parts = routesAlias.getOrigin(exports.history.location.pathname).split('/');
|
|
239
271
|
parts.pop();
|
|
240
272
|
pathPieces.pathname.split('/').forEach((item) => {
|
|
@@ -254,42 +286,44 @@ function processNavigateUrl(option) {
|
|
|
254
286
|
pathPieces.search = '';
|
|
255
287
|
return pathPieces;
|
|
256
288
|
}
|
|
257
|
-
|
|
258
|
-
return
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
const
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
289
|
+
function navigate(option, method) {
|
|
290
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
291
|
+
return new Promise((resolve, reject) => {
|
|
292
|
+
const { success, complete, fail } = option;
|
|
293
|
+
const unListen = exports.history.listen(() => {
|
|
294
|
+
const res = { errMsg: `${method}:ok` };
|
|
295
|
+
success === null || success === void 0 ? void 0 : success(res);
|
|
296
|
+
complete === null || complete === void 0 ? void 0 : complete(res);
|
|
297
|
+
resolve(res);
|
|
298
|
+
unListen();
|
|
299
|
+
});
|
|
300
|
+
try {
|
|
301
|
+
if ('url' in option) {
|
|
302
|
+
const pathPieces = processNavigateUrl(option);
|
|
303
|
+
const state = { timestamp: Date.now() };
|
|
304
|
+
if (method === 'navigateTo') {
|
|
305
|
+
exports.history.push(pathPieces, state);
|
|
306
|
+
}
|
|
307
|
+
else if (method === 'redirectTo' || method === 'switchTab') {
|
|
308
|
+
exports.history.replace(pathPieces, state);
|
|
309
|
+
}
|
|
310
|
+
else if (method === 'reLaunch') {
|
|
311
|
+
stacks.delta = stacks.length;
|
|
312
|
+
exports.history.replace(pathPieces, state);
|
|
313
|
+
}
|
|
276
314
|
}
|
|
277
|
-
else if (method === '
|
|
278
|
-
stacks.delta =
|
|
279
|
-
exports.history.
|
|
315
|
+
else if (method === 'navigateBack') {
|
|
316
|
+
stacks.delta = option.delta;
|
|
317
|
+
exports.history.go(-option.delta);
|
|
280
318
|
}
|
|
281
319
|
}
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
320
|
+
catch (error) {
|
|
321
|
+
const res = { errMsg: `${method}:fail ${error.message || error}` };
|
|
322
|
+
fail === null || fail === void 0 ? void 0 : fail(res);
|
|
323
|
+
complete === null || complete === void 0 ? void 0 : complete(res);
|
|
324
|
+
reject(res);
|
|
285
325
|
}
|
|
286
|
-
}
|
|
287
|
-
catch (error) {
|
|
288
|
-
const res = { errMsg: `${method}:fail ${error.message || error}` };
|
|
289
|
-
fail?.(res);
|
|
290
|
-
complete?.(res);
|
|
291
|
-
reject(res);
|
|
292
|
-
}
|
|
326
|
+
});
|
|
293
327
|
});
|
|
294
328
|
}
|
|
295
329
|
function navigateTo(option) {
|
|
@@ -315,7 +349,7 @@ function getCurrentPages() {
|
|
|
315
349
|
console.warn('多页面路由模式不支持使用 getCurrentPages 方法!');
|
|
316
350
|
}
|
|
317
351
|
const pages = stacks.get();
|
|
318
|
-
return pages.map(e => ({
|
|
352
|
+
return pages.map(e => (Object.assign(Object.assign({}, e), { route: e.path || '' })));
|
|
319
353
|
}
|
|
320
354
|
|
|
321
355
|
/**
|
|
@@ -417,7 +451,7 @@ function initTabbar(config) {
|
|
|
417
451
|
tabbar.conf.basename = routerConfig.basename;
|
|
418
452
|
}
|
|
419
453
|
const container = document.getElementById('container');
|
|
420
|
-
container
|
|
454
|
+
container === null || container === void 0 ? void 0 : container.appendChild(tabbar);
|
|
421
455
|
taro.initTabBarApis(config);
|
|
422
456
|
}
|
|
423
457
|
|
|
@@ -427,13 +461,8 @@ function setDisplay(el, type = '') {
|
|
|
427
461
|
}
|
|
428
462
|
}
|
|
429
463
|
class PageHandler {
|
|
430
|
-
config;
|
|
431
|
-
defaultAnimation = { duration: 300, delay: 50 };
|
|
432
|
-
unloadTimer;
|
|
433
|
-
hideTimer;
|
|
434
|
-
lastHidePage;
|
|
435
|
-
lastUnloadPage;
|
|
436
464
|
constructor(config) {
|
|
465
|
+
this.defaultAnimation = { duration: 300, delay: 50 };
|
|
437
466
|
this.config = config;
|
|
438
467
|
this.mount();
|
|
439
468
|
}
|
|
@@ -442,21 +471,23 @@ class PageHandler {
|
|
|
442
471
|
get routerMode() { return this.router.mode || 'hash'; }
|
|
443
472
|
get customRoutes() { return this.router.customRoutes || {}; }
|
|
444
473
|
get routes() { return this.config.routes; }
|
|
445
|
-
get tabBarList() { return this.config.tabBar
|
|
474
|
+
get tabBarList() { var _a; return ((_a = this.config.tabBar) === null || _a === void 0 ? void 0 : _a.list) || []; }
|
|
446
475
|
get PullDownRefresh() { return this.config.PullDownRefresh; }
|
|
447
|
-
get animation() { return this.config
|
|
476
|
+
get animation() { var _a, _b; return (_b = (_a = this.config) === null || _a === void 0 ? void 0 : _a.animation) !== null && _b !== void 0 ? _b : this.defaultAnimation; }
|
|
448
477
|
get animationDelay() {
|
|
478
|
+
var _a;
|
|
449
479
|
return (typeof this.animation === 'object'
|
|
450
480
|
? this.animation.delay
|
|
451
481
|
: this.animation
|
|
452
|
-
? this.defaultAnimation
|
|
482
|
+
? (_a = this.defaultAnimation) === null || _a === void 0 ? void 0 : _a.delay
|
|
453
483
|
: 0) || 0;
|
|
454
484
|
}
|
|
455
485
|
get animationDuration() {
|
|
486
|
+
var _a;
|
|
456
487
|
return (typeof this.animation === 'object'
|
|
457
488
|
? this.animation.duration
|
|
458
489
|
: this.animation
|
|
459
|
-
? this.defaultAnimation
|
|
490
|
+
? (_a = this.defaultAnimation) === null || _a === void 0 ? void 0 : _a.duration
|
|
460
491
|
: 0) || 0;
|
|
461
492
|
}
|
|
462
493
|
set pathname(p) { this.router.pathname = p; }
|
|
@@ -464,27 +495,29 @@ class PageHandler {
|
|
|
464
495
|
get basename() { return this.router.basename || ''; }
|
|
465
496
|
get pageConfig() {
|
|
466
497
|
return this.routes.find(r => {
|
|
498
|
+
var _a;
|
|
467
499
|
const routePath = stripBasename(this.pathname, this.basename);
|
|
468
500
|
const pagePath = addLeadingSlash(r.path);
|
|
469
|
-
return pagePath === routePath || routesAlias.getConfig(pagePath)
|
|
501
|
+
return pagePath === routePath || ((_a = routesAlias.getConfig(pagePath)) === null || _a === void 0 ? void 0 : _a.includes(routePath));
|
|
470
502
|
});
|
|
471
503
|
}
|
|
472
504
|
get isTabBar() {
|
|
505
|
+
var _a;
|
|
473
506
|
const routePath = stripBasename(this.pathname, this.basename);
|
|
474
|
-
const pagePath = Object.entries(this.customRoutes).find(([, target]) => {
|
|
507
|
+
const pagePath = ((_a = Object.entries(this.customRoutes).find(([, target]) => {
|
|
475
508
|
if (typeof target === 'string') {
|
|
476
509
|
return target === routePath;
|
|
477
510
|
}
|
|
478
|
-
else if (target
|
|
511
|
+
else if ((target === null || target === void 0 ? void 0 : target.length) > 0) {
|
|
479
512
|
return target.includes(routePath);
|
|
480
513
|
}
|
|
481
514
|
return false;
|
|
482
|
-
})
|
|
515
|
+
})) === null || _a === void 0 ? void 0 : _a[0]) || routePath;
|
|
483
516
|
return !!pagePath && this.tabBarList.some(t => t.pagePath === pagePath);
|
|
484
517
|
}
|
|
485
518
|
isSamePage(page) {
|
|
486
519
|
const routePath = stripBasename(this.pathname, this.basename);
|
|
487
|
-
const pagePath = stripBasename(page
|
|
520
|
+
const pagePath = stripBasename(page === null || page === void 0 ? void 0 : page.path, this.basename);
|
|
488
521
|
return pagePath.startsWith(routePath + '?');
|
|
489
522
|
}
|
|
490
523
|
get search() {
|
|
@@ -506,11 +539,12 @@ class PageHandler {
|
|
|
506
539
|
? queryString__default["default"].parse(search, { decode: false })
|
|
507
540
|
: {};
|
|
508
541
|
query.stamp = stamp.toString();
|
|
509
|
-
return {
|
|
542
|
+
return Object.assign(Object.assign({}, query), options);
|
|
510
543
|
}
|
|
511
544
|
mount() {
|
|
545
|
+
var _a;
|
|
512
546
|
setHistoryMode(this.routerMode, this.router.basename);
|
|
513
|
-
document.getElementById('app')
|
|
547
|
+
(_a = document.getElementById('app')) === null || _a === void 0 ? void 0 : _a.remove();
|
|
514
548
|
this.animation && loadAnimateStyle(this.animationDuration);
|
|
515
549
|
const app = document.createElement('div');
|
|
516
550
|
app.id = this.appId;
|
|
@@ -531,12 +565,14 @@ class PageHandler {
|
|
|
531
565
|
}
|
|
532
566
|
}
|
|
533
567
|
onReady(page, onLoad = true) {
|
|
568
|
+
var _a, _b;
|
|
534
569
|
const pageEl = this.getPageContainer(page);
|
|
535
|
-
if (pageEl && !pageEl
|
|
570
|
+
if (pageEl && !(pageEl === null || pageEl === void 0 ? void 0 : pageEl['__isReady'])) {
|
|
536
571
|
const el = pageEl.firstElementChild;
|
|
537
|
-
el
|
|
572
|
+
(_b = (_a = el === null || el === void 0 ? void 0 : el['componentOnReady']) === null || _a === void 0 ? void 0 : _a.call(el)) === null || _b === void 0 ? void 0 : _b.then(() => {
|
|
538
573
|
runtime.requestAnimationFrame(() => {
|
|
539
|
-
|
|
574
|
+
var _a;
|
|
575
|
+
(_a = page.onReady) === null || _a === void 0 ? void 0 : _a.call(page);
|
|
540
576
|
pageEl['__isReady'] = true;
|
|
541
577
|
});
|
|
542
578
|
});
|
|
@@ -544,6 +580,7 @@ class PageHandler {
|
|
|
544
580
|
}
|
|
545
581
|
}
|
|
546
582
|
load(page, pageConfig = {}, stacksIndex = 0) {
|
|
583
|
+
var _a, _b;
|
|
547
584
|
if (!page)
|
|
548
585
|
return;
|
|
549
586
|
// NOTE: 页面栈推入太晚可能导致 getCurrentPages 无法获取到当前页面实例
|
|
@@ -554,21 +591,23 @@ class PageHandler {
|
|
|
554
591
|
setDisplay(pageEl);
|
|
555
592
|
this.isTabBar && pageEl.classList.add('taro_tabbar_page');
|
|
556
593
|
this.addAnimation(pageEl, stacksIndex === 0);
|
|
557
|
-
page.onShow
|
|
594
|
+
(_a = page.onShow) === null || _a === void 0 ? void 0 : _a.call(page);
|
|
558
595
|
this.bindPageEvents(page, pageEl, pageConfig);
|
|
559
596
|
}
|
|
560
597
|
else {
|
|
561
|
-
page.onLoad
|
|
598
|
+
(_b = page.onLoad) === null || _b === void 0 ? void 0 : _b.call(page, param, () => {
|
|
599
|
+
var _a;
|
|
562
600
|
pageEl = this.getPageContainer(page);
|
|
563
|
-
this.isTabBar && pageEl
|
|
601
|
+
this.isTabBar && (pageEl === null || pageEl === void 0 ? void 0 : pageEl.classList.add('taro_tabbar_page'));
|
|
564
602
|
this.addAnimation(pageEl, stacksIndex === 0);
|
|
565
603
|
this.onReady(page, true);
|
|
566
|
-
page.onShow
|
|
604
|
+
(_a = page.onShow) === null || _a === void 0 ? void 0 : _a.call(page);
|
|
567
605
|
this.bindPageEvents(page, pageEl, pageConfig);
|
|
568
606
|
});
|
|
569
607
|
}
|
|
570
608
|
}
|
|
571
609
|
unload(page, delta = 1, top = false) {
|
|
610
|
+
var _a, _b, _c;
|
|
572
611
|
if (!page)
|
|
573
612
|
return;
|
|
574
613
|
stacks.delta = --delta;
|
|
@@ -576,28 +615,30 @@ class PageHandler {
|
|
|
576
615
|
if (this.animation && top) {
|
|
577
616
|
if (this.unloadTimer) {
|
|
578
617
|
clearTimeout(this.unloadTimer);
|
|
579
|
-
this.lastUnloadPage
|
|
618
|
+
(_b = (_a = this.lastUnloadPage) === null || _a === void 0 ? void 0 : _a.onUnload) === null || _b === void 0 ? void 0 : _b.call(_a);
|
|
580
619
|
this.unloadTimer = null;
|
|
581
620
|
}
|
|
582
621
|
this.lastUnloadPage = page;
|
|
583
622
|
const pageEl = this.getPageContainer(page);
|
|
584
|
-
pageEl
|
|
585
|
-
pageEl
|
|
623
|
+
pageEl === null || pageEl === void 0 ? void 0 : pageEl.classList.remove('taro_page_stationed');
|
|
624
|
+
pageEl === null || pageEl === void 0 ? void 0 : pageEl.classList.remove('taro_page_show');
|
|
586
625
|
this.unloadTimer = setTimeout(() => {
|
|
626
|
+
var _a, _b;
|
|
587
627
|
this.unloadTimer = null;
|
|
588
|
-
this.lastUnloadPage
|
|
628
|
+
(_b = (_a = this.lastUnloadPage) === null || _a === void 0 ? void 0 : _a.onUnload) === null || _b === void 0 ? void 0 : _b.call(_a);
|
|
589
629
|
}, this.animationDuration);
|
|
590
630
|
}
|
|
591
631
|
else {
|
|
592
632
|
const pageEl = this.getPageContainer(page);
|
|
593
|
-
pageEl
|
|
594
|
-
pageEl
|
|
595
|
-
page
|
|
633
|
+
pageEl === null || pageEl === void 0 ? void 0 : pageEl.classList.remove('taro_page_stationed');
|
|
634
|
+
pageEl === null || pageEl === void 0 ? void 0 : pageEl.classList.remove('taro_page_show');
|
|
635
|
+
(_c = page === null || page === void 0 ? void 0 : page.onUnload) === null || _c === void 0 ? void 0 : _c.call(page);
|
|
596
636
|
}
|
|
597
637
|
if (delta >= 1)
|
|
598
638
|
this.unload(stacks.last, delta);
|
|
599
639
|
}
|
|
600
640
|
show(page, pageConfig = {}, stacksIndex = 0) {
|
|
641
|
+
var _a, _b;
|
|
601
642
|
if (!page)
|
|
602
643
|
return;
|
|
603
644
|
const param = this.getQuery(stacks.length, '', page.options);
|
|
@@ -605,20 +646,22 @@ class PageHandler {
|
|
|
605
646
|
if (pageEl) {
|
|
606
647
|
setDisplay(pageEl);
|
|
607
648
|
this.addAnimation(pageEl, stacksIndex === 0);
|
|
608
|
-
page.onShow
|
|
649
|
+
(_a = page.onShow) === null || _a === void 0 ? void 0 : _a.call(page);
|
|
609
650
|
this.bindPageEvents(page, pageEl, pageConfig);
|
|
610
651
|
}
|
|
611
652
|
else {
|
|
612
|
-
page.onLoad
|
|
653
|
+
(_b = page.onLoad) === null || _b === void 0 ? void 0 : _b.call(page, param, () => {
|
|
654
|
+
var _a;
|
|
613
655
|
pageEl = this.getPageContainer(page);
|
|
614
656
|
this.addAnimation(pageEl, stacksIndex === 0);
|
|
615
657
|
this.onReady(page, false);
|
|
616
|
-
page.onShow
|
|
658
|
+
(_a = page.onShow) === null || _a === void 0 ? void 0 : _a.call(page);
|
|
617
659
|
this.bindPageEvents(page, pageEl, pageConfig);
|
|
618
660
|
});
|
|
619
661
|
}
|
|
620
662
|
}
|
|
621
663
|
hide(page) {
|
|
664
|
+
var _a;
|
|
622
665
|
if (!page)
|
|
623
666
|
return;
|
|
624
667
|
// NOTE: 修复多页并发问题,此处可能因为路由跳转过快,执行时页面可能还没有创建成功
|
|
@@ -634,7 +677,7 @@ class PageHandler {
|
|
|
634
677
|
this.hideTimer = null;
|
|
635
678
|
setDisplay(this.lastHidePage, 'none');
|
|
636
679
|
}, this.animationDuration + this.animationDelay);
|
|
637
|
-
page.onHide
|
|
680
|
+
(_a = page.onHide) === null || _a === void 0 ? void 0 : _a.call(page);
|
|
638
681
|
}
|
|
639
682
|
else {
|
|
640
683
|
setTimeout(() => this.hide(page), 0);
|
|
@@ -657,8 +700,9 @@ class PageHandler {
|
|
|
657
700
|
}
|
|
658
701
|
}
|
|
659
702
|
getPageContainer(page) {
|
|
660
|
-
|
|
661
|
-
const
|
|
703
|
+
var _a;
|
|
704
|
+
const path = page ? page === null || page === void 0 ? void 0 : page.path : (_a = runtime.Current.page) === null || _a === void 0 ? void 0 : _a.path;
|
|
705
|
+
const id = path === null || path === void 0 ? void 0 : path.replace(/([^a-z0-9\u00a0-\uffff_-])/ig, '\\$1');
|
|
662
706
|
if (page) {
|
|
663
707
|
return document.querySelector(`.taro_page#${id}`);
|
|
664
708
|
}
|
|
@@ -669,17 +713,18 @@ class PageHandler {
|
|
|
669
713
|
return el || window;
|
|
670
714
|
}
|
|
671
715
|
bindPageEvents(page, pageEl, config = {}) {
|
|
716
|
+
var _a;
|
|
672
717
|
if (!pageEl) {
|
|
673
718
|
pageEl = this.getPageContainer();
|
|
674
719
|
}
|
|
675
|
-
const distance = config.onReachBottomDistance || this.config.window
|
|
720
|
+
const distance = config.onReachBottomDistance || ((_a = this.config.window) === null || _a === void 0 ? void 0 : _a.onReachBottomDistance) || 50;
|
|
676
721
|
bindPageScroll(page, pageEl, distance);
|
|
677
722
|
bindPageResize(page);
|
|
678
723
|
}
|
|
679
724
|
}
|
|
680
725
|
|
|
681
|
-
/* eslint-disable dot-notation */
|
|
682
726
|
function createRouter(app, config, framework) {
|
|
727
|
+
var _a, _b, _c;
|
|
683
728
|
RouterConfig.config = config;
|
|
684
729
|
const handler = new PageHandler(config);
|
|
685
730
|
const runtimeHooks = runtime.container.get(runtime.SERVICE_IDENTIFIER.Hooks);
|
|
@@ -689,19 +734,20 @@ function createRouter(app, config, framework) {
|
|
|
689
734
|
path: routesAlias.getAll(addLeadingSlash(route.path)),
|
|
690
735
|
action: route.load
|
|
691
736
|
}));
|
|
692
|
-
const entryPagePath = config.entryPagePath || routes[0].path
|
|
737
|
+
const entryPagePath = config.entryPagePath || ((_a = routes[0].path) === null || _a === void 0 ? void 0 : _a[0]) || '';
|
|
693
738
|
const router = new UniversalRouter__default["default"](routes, { baseUrl: basename || '' });
|
|
694
739
|
const launchParam = handler.getQuery(stacks.length);
|
|
695
|
-
app.onLaunch
|
|
696
|
-
const render =
|
|
740
|
+
(_b = app.onLaunch) === null || _b === void 0 ? void 0 : _b.call(app, launchParam);
|
|
741
|
+
const render = ({ location, action }) => __awaiter(this, void 0, void 0, function* () {
|
|
742
|
+
var _d, _e, _f, _g, _h;
|
|
697
743
|
handler.pathname = decodeURI(location.pathname);
|
|
698
744
|
let element;
|
|
699
745
|
try {
|
|
700
|
-
element =
|
|
746
|
+
element = yield router.resolve(handler.router.forcePath || handler.pathname);
|
|
701
747
|
}
|
|
702
748
|
catch (error) {
|
|
703
749
|
if (error.status === 404) {
|
|
704
|
-
app.onPageNotFound
|
|
750
|
+
(_d = app.onPageNotFound) === null || _d === void 0 ? void 0 : _d.call(app, {
|
|
705
751
|
path: handler.pathname
|
|
706
752
|
});
|
|
707
753
|
}
|
|
@@ -712,14 +758,14 @@ function createRouter(app, config, framework) {
|
|
|
712
758
|
if (!element)
|
|
713
759
|
return;
|
|
714
760
|
const pageConfig = handler.pageConfig;
|
|
715
|
-
let enablePullDownRefresh = config
|
|
761
|
+
let enablePullDownRefresh = ((_e = config === null || config === void 0 ? void 0 : config.window) === null || _e === void 0 ? void 0 : _e.enablePullDownRefresh) || false;
|
|
716
762
|
runtime.eventCenter.trigger('__taroRouterChange', {
|
|
717
763
|
toLocation: {
|
|
718
764
|
path: handler.pathname
|
|
719
765
|
}
|
|
720
766
|
});
|
|
721
767
|
if (pageConfig) {
|
|
722
|
-
document.title = pageConfig.navigationBarTitleText
|
|
768
|
+
document.title = (_f = pageConfig.navigationBarTitleText) !== null && _f !== void 0 ? _f : document.title;
|
|
723
769
|
if (typeof pageConfig.enablePullDownRefresh === 'boolean') {
|
|
724
770
|
enablePullDownRefresh = pageConfig.enablePullDownRefresh;
|
|
725
771
|
}
|
|
@@ -761,28 +807,25 @@ function createRouter(app, config, framework) {
|
|
|
761
807
|
shouldLoad = true;
|
|
762
808
|
}
|
|
763
809
|
if (shouldLoad || stacks.length < 1) {
|
|
764
|
-
const el = element.default
|
|
765
|
-
const loadConfig = {
|
|
810
|
+
const el = (_g = element.default) !== null && _g !== void 0 ? _g : element;
|
|
811
|
+
const loadConfig = Object.assign({}, pageConfig);
|
|
766
812
|
const stacksIndex = stacks.length;
|
|
767
813
|
delete loadConfig['path'];
|
|
768
814
|
delete loadConfig['load'];
|
|
769
|
-
const page = runtime.createPageConfig(enablePullDownRefresh ? runtimeHooks.createPullDownComponent
|
|
815
|
+
const page = runtime.createPageConfig(enablePullDownRefresh ? (_h = runtimeHooks.createPullDownComponent) === null || _h === void 0 ? void 0 : _h.call(runtimeHooks, el, location.pathname, framework, handler.PullDownRefresh) : el, pathname + runtime.stringify(handler.getQuery(stacksIndex)), {}, loadConfig);
|
|
770
816
|
return handler.load(page, pageConfig, stacksIndex);
|
|
771
817
|
}
|
|
772
|
-
};
|
|
773
|
-
|
|
774
|
-
|
|
775
|
-
|
|
776
|
-
exports.history.replace(prependBasename(entryPagePath + exports.history.location.search));
|
|
777
|
-
}
|
|
818
|
+
});
|
|
819
|
+
const stripped = stripBasename(exports.history.location.pathname, handler.basename);
|
|
820
|
+
if (stripped === '/' || stripped === '') {
|
|
821
|
+
exports.history.replace(prependBasename(entryPagePath + exports.history.location.search));
|
|
778
822
|
}
|
|
779
823
|
render({ location: exports.history.location, action: history.Action.Push });
|
|
780
|
-
app.onShow
|
|
824
|
+
(_c = app.onShow) === null || _c === void 0 ? void 0 : _c.call(app, launchParam);
|
|
781
825
|
return exports.history.listen(render);
|
|
782
826
|
}
|
|
783
827
|
|
|
784
828
|
class MultiPageHandler {
|
|
785
|
-
config;
|
|
786
829
|
constructor(config) {
|
|
787
830
|
this.config = config;
|
|
788
831
|
this.mount();
|
|
@@ -791,23 +834,24 @@ class MultiPageHandler {
|
|
|
791
834
|
get router() { return this.config.router; }
|
|
792
835
|
get routerMode() { return this.router.mode || 'hash'; }
|
|
793
836
|
get customRoutes() { return this.router.customRoutes || {}; }
|
|
794
|
-
get tabBarList() { return this.config.tabBar
|
|
837
|
+
get tabBarList() { var _a; return ((_a = this.config.tabBar) === null || _a === void 0 ? void 0 : _a.list) || []; }
|
|
795
838
|
get PullDownRefresh() { return this.config.PullDownRefresh; }
|
|
796
839
|
set pathname(p) { this.router.pathname = p; }
|
|
797
840
|
get pathname() { return this.router.pathname; }
|
|
798
841
|
get basename() { return this.router.basename || ''; }
|
|
799
842
|
get pageConfig() { return this.config.route; }
|
|
800
843
|
get isTabBar() {
|
|
844
|
+
var _a;
|
|
801
845
|
const routePath = stripBasename(this.pathname, this.basename);
|
|
802
|
-
const pagePath = Object.entries(this.customRoutes).find(([, target]) => {
|
|
846
|
+
const pagePath = ((_a = Object.entries(this.customRoutes).find(([, target]) => {
|
|
803
847
|
if (typeof target === 'string') {
|
|
804
848
|
return target === routePath;
|
|
805
849
|
}
|
|
806
|
-
else if (target
|
|
850
|
+
else if ((target === null || target === void 0 ? void 0 : target.length) > 0) {
|
|
807
851
|
return target.includes(routePath);
|
|
808
852
|
}
|
|
809
853
|
return false;
|
|
810
|
-
})
|
|
854
|
+
})) === null || _a === void 0 ? void 0 : _a[0]) || routePath;
|
|
811
855
|
return !!pagePath && this.tabBarList.some(t => t.pagePath === pagePath);
|
|
812
856
|
}
|
|
813
857
|
get search() { return location.search.substr(1); }
|
|
@@ -816,11 +860,12 @@ class MultiPageHandler {
|
|
|
816
860
|
const query = search
|
|
817
861
|
? queryString__default["default"].parse(search)
|
|
818
862
|
: {};
|
|
819
|
-
return {
|
|
863
|
+
return Object.assign(Object.assign({}, query), options);
|
|
820
864
|
}
|
|
821
865
|
mount() {
|
|
866
|
+
var _a;
|
|
822
867
|
setHistoryMode(this.routerMode, this.router.basename);
|
|
823
|
-
document.getElementById('app')
|
|
868
|
+
(_a = document.getElementById('app')) === null || _a === void 0 ? void 0 : _a.remove();
|
|
824
869
|
const app = document.createElement('div');
|
|
825
870
|
app.id = this.appId;
|
|
826
871
|
app.classList.add('taro_router');
|
|
@@ -840,27 +885,31 @@ class MultiPageHandler {
|
|
|
840
885
|
}
|
|
841
886
|
}
|
|
842
887
|
onReady(page, onLoad = true) {
|
|
888
|
+
var _a;
|
|
843
889
|
const pageEl = this.getPageContainer(page);
|
|
844
|
-
if (pageEl && !pageEl
|
|
890
|
+
if (pageEl && !(pageEl === null || pageEl === void 0 ? void 0 : pageEl['__isReady'])) {
|
|
845
891
|
const el = pageEl.firstElementChild;
|
|
846
|
-
el
|
|
892
|
+
(_a = el === null || el === void 0 ? void 0 : el['componentOnReady']) === null || _a === void 0 ? void 0 : _a.call(el);
|
|
847
893
|
onLoad && (pageEl['__page'] = page);
|
|
848
894
|
}
|
|
849
895
|
}
|
|
850
896
|
load(page, pageConfig = {}) {
|
|
897
|
+
var _a;
|
|
851
898
|
if (!page)
|
|
852
899
|
return;
|
|
853
|
-
page.onLoad
|
|
900
|
+
(_a = page.onLoad) === null || _a === void 0 ? void 0 : _a.call(page, this.getQuery('', page.options), () => {
|
|
901
|
+
var _a;
|
|
854
902
|
const pageEl = this.getPageContainer(page);
|
|
855
|
-
this.isTabBar && pageEl
|
|
903
|
+
this.isTabBar && (pageEl === null || pageEl === void 0 ? void 0 : pageEl.classList.add('taro_tabbar_page'));
|
|
856
904
|
this.onReady(page, true);
|
|
857
|
-
page.onShow
|
|
905
|
+
(_a = page.onShow) === null || _a === void 0 ? void 0 : _a.call(page);
|
|
858
906
|
this.bindPageEvents(page, pageEl, pageConfig);
|
|
859
907
|
});
|
|
860
908
|
}
|
|
861
909
|
getPageContainer(page) {
|
|
862
|
-
|
|
863
|
-
const
|
|
910
|
+
var _a;
|
|
911
|
+
const path = page ? page === null || page === void 0 ? void 0 : page.path : (_a = runtime.Current.page) === null || _a === void 0 ? void 0 : _a.path;
|
|
912
|
+
const id = path === null || path === void 0 ? void 0 : path.replace(/([^a-z0-9\u00a0-\uffff_-])/ig, '\\$1');
|
|
864
913
|
if (page) {
|
|
865
914
|
return document.querySelector(`.taro_page#${id}`);
|
|
866
915
|
}
|
|
@@ -871,16 +920,16 @@ class MultiPageHandler {
|
|
|
871
920
|
return el || window;
|
|
872
921
|
}
|
|
873
922
|
bindPageEvents(page, pageEl, config = {}) {
|
|
923
|
+
var _a;
|
|
874
924
|
if (!pageEl) {
|
|
875
925
|
pageEl = this.getPageContainer();
|
|
876
926
|
}
|
|
877
|
-
const distance = config.onReachBottomDistance || this.config.window
|
|
927
|
+
const distance = config.onReachBottomDistance || ((_a = this.config.window) === null || _a === void 0 ? void 0 : _a.onReachBottomDistance) || 50;
|
|
878
928
|
bindPageScroll(page, pageEl, distance);
|
|
879
929
|
bindPageResize(page);
|
|
880
930
|
}
|
|
881
931
|
}
|
|
882
932
|
|
|
883
|
-
/* eslint-disable dot-notation */
|
|
884
933
|
// TODO 支持多路由 (APP 生命周期仅触发一次)
|
|
885
934
|
/** Note: 关于多页面应用
|
|
886
935
|
* - 需要配置路由映射(根目录跳转、404 页面……)
|
|
@@ -889,42 +938,45 @@ class MultiPageHandler {
|
|
|
889
938
|
* - TabBar 会多次加载
|
|
890
939
|
* - 不支持路由动画
|
|
891
940
|
*/
|
|
892
|
-
|
|
893
|
-
|
|
894
|
-
|
|
895
|
-
|
|
896
|
-
|
|
897
|
-
|
|
898
|
-
|
|
899
|
-
|
|
900
|
-
|
|
901
|
-
|
|
902
|
-
element
|
|
903
|
-
|
|
904
|
-
|
|
905
|
-
|
|
906
|
-
|
|
907
|
-
|
|
908
|
-
|
|
909
|
-
|
|
910
|
-
|
|
911
|
-
|
|
912
|
-
|
|
941
|
+
function createMultiRouter(app, config, framework) {
|
|
942
|
+
var _a, _b, _c, _d, _e, _f, _g;
|
|
943
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
944
|
+
RouterConfig.config = config;
|
|
945
|
+
const handler = new MultiPageHandler(config);
|
|
946
|
+
const runtimeHooks = runtime.container.get(runtime.SERVICE_IDENTIFIER.Hooks);
|
|
947
|
+
const launchParam = handler.getQuery();
|
|
948
|
+
(_a = app.onLaunch) === null || _a === void 0 ? void 0 : _a.call(app, launchParam);
|
|
949
|
+
const pathName = config.pageName;
|
|
950
|
+
const pageConfig = handler.pageConfig;
|
|
951
|
+
let element;
|
|
952
|
+
try {
|
|
953
|
+
element = yield ((_b = pageConfig.load) === null || _b === void 0 ? void 0 : _b.call(pageConfig));
|
|
954
|
+
}
|
|
955
|
+
catch (error) {
|
|
956
|
+
throw new Error(error);
|
|
957
|
+
}
|
|
958
|
+
if (!element)
|
|
959
|
+
return;
|
|
960
|
+
let enablePullDownRefresh = ((_c = config === null || config === void 0 ? void 0 : config.window) === null || _c === void 0 ? void 0 : _c.enablePullDownRefresh) || false;
|
|
961
|
+
runtime.eventCenter.trigger('__taroRouterChange', {
|
|
962
|
+
toLocation: {
|
|
963
|
+
path: pathName
|
|
964
|
+
}
|
|
965
|
+
});
|
|
966
|
+
if (pageConfig) {
|
|
967
|
+
document.title = (_d = pageConfig.navigationBarTitleText) !== null && _d !== void 0 ? _d : document.title;
|
|
968
|
+
if (typeof pageConfig.enablePullDownRefresh === 'boolean') {
|
|
969
|
+
enablePullDownRefresh = pageConfig.enablePullDownRefresh;
|
|
970
|
+
}
|
|
913
971
|
}
|
|
972
|
+
const el = (_e = element.default) !== null && _e !== void 0 ? _e : element;
|
|
973
|
+
const loadConfig = Object.assign({}, pageConfig);
|
|
974
|
+
delete loadConfig['path'];
|
|
975
|
+
delete loadConfig['load'];
|
|
976
|
+
const page = runtime.createPageConfig(enablePullDownRefresh ? (_f = runtimeHooks.createPullDownComponent) === null || _f === void 0 ? void 0 : _f.call(runtimeHooks, el, location.pathname, framework, config.PullDownRefresh) : el, pathName + runtime.stringify(launchParam), {}, loadConfig);
|
|
977
|
+
handler.load(page, pageConfig);
|
|
978
|
+
(_g = app.onShow) === null || _g === void 0 ? void 0 : _g.call(app, launchParam);
|
|
914
979
|
});
|
|
915
|
-
if (pageConfig) {
|
|
916
|
-
document.title = pageConfig.navigationBarTitleText ?? document.title;
|
|
917
|
-
if (typeof pageConfig.enablePullDownRefresh === 'boolean') {
|
|
918
|
-
enablePullDownRefresh = pageConfig.enablePullDownRefresh;
|
|
919
|
-
}
|
|
920
|
-
}
|
|
921
|
-
const el = element.default ?? element;
|
|
922
|
-
const loadConfig = { ...pageConfig };
|
|
923
|
-
delete loadConfig['path'];
|
|
924
|
-
delete loadConfig['load'];
|
|
925
|
-
const page = runtime.createPageConfig(enablePullDownRefresh ? runtimeHooks.createPullDownComponent?.(el, location.pathname, framework, config.PullDownRefresh) : el, pathName + runtime.stringify(launchParam), {}, loadConfig);
|
|
926
|
-
handler.load(page, pageConfig);
|
|
927
|
-
app.onShow?.(launchParam);
|
|
928
980
|
}
|
|
929
981
|
|
|
930
982
|
exports.createMultiRouter = createMultiRouter;
|