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