@tarojs/router 3.6.30 → 3.6.31-alpha.0
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 +1 -0
- package/dist/index.cjs.js +38 -19
- package/dist/index.esm.js +38 -19
- package/dist/router/page.js +3 -2
- package/dist/router/spa.js +24 -12
- package/dist/style.d.ts +1 -1
- package/dist/style.js +10 -5
- package/package.json +7 -7
- package/types/router.d.ts +2 -0
package/dist/api.js
CHANGED
|
@@ -54,6 +54,7 @@ function navigate(option, method) {
|
|
|
54
54
|
const pathPieces = processNavigateUrl(option);
|
|
55
55
|
const state = { timestamp: Date.now() };
|
|
56
56
|
if (method === 'navigateTo') {
|
|
57
|
+
// Note: 由于 spa 会针对弱网情况下,短时间内多次跳转同一个页面跳转加了锁,后续如果有用户反馈返回无效,那可能是这个问题
|
|
57
58
|
history.push(pathPieces, state);
|
|
58
59
|
}
|
|
59
60
|
else if (method === 'redirectTo' || method === 'switchTab') {
|
package/dist/index.cjs.js
CHANGED
|
@@ -15,7 +15,8 @@ var UniversalRouter = require('universal-router');
|
|
|
15
15
|
function loadAnimateStyle(ms = 300) {
|
|
16
16
|
const css = `
|
|
17
17
|
body {
|
|
18
|
-
|
|
18
|
+
/* 防止 iOS 页面滚动 */
|
|
19
|
+
overflow: hidden;
|
|
19
20
|
}
|
|
20
21
|
.taro_router > .taro_page {
|
|
21
22
|
position: absolute;
|
|
@@ -44,7 +45,7 @@ body {
|
|
|
44
45
|
/**
|
|
45
46
|
* 插入路由相关样式
|
|
46
47
|
*/
|
|
47
|
-
function loadRouterStyle(enableTabBar, enableWindowScroll) {
|
|
48
|
+
function loadRouterStyle(enableTabBar, enableWindowScroll, enhanceAnimation) {
|
|
48
49
|
const css = `
|
|
49
50
|
.taro_router {
|
|
50
51
|
position: relative;
|
|
@@ -72,11 +73,15 @@ ${enableTabBar ? `
|
|
|
72
73
|
}
|
|
73
74
|
|
|
74
75
|
` : ''}
|
|
75
|
-
|
|
76
|
+
${enhanceAnimation
|
|
77
|
+
? `.taro_page_shade:has(+.taro_page_stationed),
|
|
76
78
|
.taro_page_shade.taro_tabbar_page,
|
|
77
79
|
.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) {
|
|
78
80
|
display: none;
|
|
79
|
-
}
|
|
81
|
+
}` : ` .taro_page_shade,
|
|
82
|
+
.taro_router > .taro_page.taro_page_show.taro_page_stationed:not(.taro_page_shade):not(.taro_tabbar_page):not(:last-child) {
|
|
83
|
+
display: none;
|
|
84
|
+
}`}
|
|
80
85
|
`;
|
|
81
86
|
addStyle(css);
|
|
82
87
|
}
|
|
@@ -142,7 +147,7 @@ function loadNavigationBarStyle() {
|
|
|
142
147
|
to {
|
|
143
148
|
transform: rotate(360deg);
|
|
144
149
|
}
|
|
145
|
-
}
|
|
150
|
+
}
|
|
146
151
|
|
|
147
152
|
.taro-navigation-bar-no-icon > .taro-navigation-bar-home {
|
|
148
153
|
display: none;
|
|
@@ -573,6 +578,7 @@ function navigate(option, method) {
|
|
|
573
578
|
const pathPieces = processNavigateUrl(option);
|
|
574
579
|
const state = { timestamp: Date.now() };
|
|
575
580
|
if (method === 'navigateTo') {
|
|
581
|
+
// Note: 由于 spa 会针对弱网情况下,短时间内多次跳转同一个页面跳转加了锁,后续如果有用户反馈返回无效,那可能是这个问题
|
|
576
582
|
exports.history.push(pathPieces, state);
|
|
577
583
|
}
|
|
578
584
|
else if (method === 'redirectTo' || method === 'switchTab') {
|
|
@@ -1256,7 +1262,7 @@ class PageHandler {
|
|
|
1256
1262
|
this.pathname = exports.history.location.pathname;
|
|
1257
1263
|
// Note: 注入页面样式
|
|
1258
1264
|
this.animation && loadAnimateStyle(this.animationDuration);
|
|
1259
|
-
loadRouterStyle(this.tabBarList.length > 1, this.usingWindowScroll);
|
|
1265
|
+
loadRouterStyle(this.tabBarList.length > 1, this.usingWindowScroll, this.router.enhanceAnimation);
|
|
1260
1266
|
}
|
|
1261
1267
|
onReady(page, onLoad = true) {
|
|
1262
1268
|
var _a;
|
|
@@ -1380,7 +1386,7 @@ class PageHandler {
|
|
|
1380
1386
|
}
|
|
1381
1387
|
}
|
|
1382
1388
|
hide(page, animation = false) {
|
|
1383
|
-
var _a, _b, _c, _d, _e, _f, _g;
|
|
1389
|
+
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
1384
1390
|
if (!page)
|
|
1385
1391
|
return;
|
|
1386
1392
|
// NOTE: 修复多页并发问题,此处可能因为路由跳转过快,执行时页面可能还没有创建成功
|
|
@@ -1405,6 +1411,7 @@ class PageHandler {
|
|
|
1405
1411
|
this.hideTimer = null;
|
|
1406
1412
|
(_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');
|
|
1407
1413
|
}
|
|
1414
|
+
(_h = page.onHide) === null || _h === void 0 ? void 0 : _h.call(page);
|
|
1408
1415
|
pageEl.classList.add('taro_page_shade');
|
|
1409
1416
|
this.lastHidePage = pageEl;
|
|
1410
1417
|
}
|
|
@@ -1478,6 +1485,10 @@ function createRouter(history$1, app, config, framework) {
|
|
|
1478
1485
|
}
|
|
1479
1486
|
RouterConfig.config = config;
|
|
1480
1487
|
const handler = new PageHandler(config, history$1);
|
|
1488
|
+
// Note: 弱网情况下,快速切换 tab,会造成同个页面实例被多次挂在到页面上,原因是资源请求是异步的,短时间内发起多个请求,
|
|
1489
|
+
// 会在资源加载完成后,同时走到挂载的逻辑,造成 pageStampId 更新不及时,两个 page 的Id 相同,后面很多操作是通过 getElementById 来进行的
|
|
1490
|
+
// 所以需要加一个锁来应对这个情况
|
|
1491
|
+
const pageLock = {};
|
|
1481
1492
|
routesAlias.set(handler.router.customRoutes);
|
|
1482
1493
|
const basename = handler.router.basename;
|
|
1483
1494
|
const routes = handler.routes.map(route => {
|
|
@@ -1501,24 +1512,30 @@ function createRouter(history$1, app, config, framework) {
|
|
|
1501
1512
|
app.onError && window.addEventListener('error', e => { var _a; return (_a = app.onError) === null || _a === void 0 ? void 0 : _a.call(app, e.message); });
|
|
1502
1513
|
const render = ({ location, action }) => tslib.__awaiter(this, void 0, void 0, function* () {
|
|
1503
1514
|
var _c, _d, _e, _f, _g, _h, _j, _k;
|
|
1504
|
-
|
|
1515
|
+
// Note: 由于下面有异步加载操作 先不要在这里去设置 handler.pathname
|
|
1516
|
+
const currentPathname = decodeURI(location.pathname);
|
|
1505
1517
|
if ((_c = window.__taroAppConfig) === null || _c === void 0 ? void 0 : _c.usingWindowScroll)
|
|
1506
1518
|
window.scrollTo(0, 0);
|
|
1507
1519
|
runtime.eventCenter.trigger('__taroRouterChange', {
|
|
1508
1520
|
toLocation: {
|
|
1509
|
-
path:
|
|
1521
|
+
path: currentPathname
|
|
1510
1522
|
}
|
|
1511
1523
|
});
|
|
1512
|
-
let element, params;
|
|
1524
|
+
let element, context, params;
|
|
1525
|
+
const routerPath = handler.router.forcePath || currentPathname;
|
|
1526
|
+
pageLock[routerPath] = typeof pageLock[routerPath] === 'number' ? pageLock[routerPath] + 1 : 1;
|
|
1527
|
+
const currentLock = pageLock[routerPath];
|
|
1528
|
+
let postLock;
|
|
1513
1529
|
try {
|
|
1514
|
-
const result = yield router.resolve(
|
|
1515
|
-
[element, , params] = yield Promise.all(result);
|
|
1530
|
+
const result = yield router.resolve(routerPath);
|
|
1531
|
+
[element, context, params] = yield Promise.all(result);
|
|
1532
|
+
postLock = pageLock[routerPath];
|
|
1516
1533
|
}
|
|
1517
1534
|
catch (error) {
|
|
1518
1535
|
if (error.status === 404) {
|
|
1519
1536
|
const notFoundEvent = {
|
|
1520
1537
|
isEntryPage: stacks.length === 0,
|
|
1521
|
-
path:
|
|
1538
|
+
path: currentPathname,
|
|
1522
1539
|
query: handler.getQuery(createStampId()),
|
|
1523
1540
|
};
|
|
1524
1541
|
(_d = app.onPageNotFound) === null || _d === void 0 ? void 0 : _d.call(app, notFoundEvent);
|
|
@@ -1532,9 +1549,12 @@ function createRouter(history$1, app, config, framework) {
|
|
|
1532
1549
|
throw error;
|
|
1533
1550
|
}
|
|
1534
1551
|
}
|
|
1535
|
-
if (!element)
|
|
1552
|
+
if (!element || currentLock !== postLock)
|
|
1536
1553
|
return;
|
|
1537
|
-
|
|
1554
|
+
// Note: 异步结束后,在设置 handler.pathname
|
|
1555
|
+
// context.pathname 在 universal-router 被处理过了,是发起资源请求的时候传入的 pathname,即 await router.resolve(routerPath) 这个 routerPath
|
|
1556
|
+
handler.pathname = context.pathname;
|
|
1557
|
+
const { pathname, pageConfig } = handler;
|
|
1538
1558
|
let enablePullDownRefresh = ((_e = config === null || config === void 0 ? void 0 : config.window) === null || _e === void 0 ? void 0 : _e.enablePullDownRefresh) || false;
|
|
1539
1559
|
let navigationStyle = ((_f = config === null || config === void 0 ? void 0 : config.window) === null || _f === void 0 ? void 0 : _f.navigationStyle) || 'default';
|
|
1540
1560
|
let navigationBarTextStyle = ((_g = config === null || config === void 0 ? void 0 : config.window) === null || _g === void 0 ? void 0 : _g.navigationBarTextStyle) || 'white';
|
|
@@ -1555,7 +1575,6 @@ function createRouter(history$1, app, config, framework) {
|
|
|
1555
1575
|
}
|
|
1556
1576
|
runtime.eventCenter.trigger('__taroSetNavigationStyle', navigationStyle, navigationBarTextStyle, navigationBarBackgroundColor);
|
|
1557
1577
|
const currentPage = runtime.Current.page;
|
|
1558
|
-
const pathname = handler.pathname;
|
|
1559
1578
|
const methodName = (_j = stacks.method) !== null && _j !== void 0 ? _j : '';
|
|
1560
1579
|
const cacheTabs = stacks.getTabs();
|
|
1561
1580
|
let shouldLoad = false;
|
|
@@ -1571,7 +1590,7 @@ function createRouter(history$1, app, config, framework) {
|
|
|
1571
1590
|
}
|
|
1572
1591
|
shouldLoad = true;
|
|
1573
1592
|
}
|
|
1574
|
-
else if (currentPage && handler.isTabBar(
|
|
1593
|
+
else if (currentPage && handler.isTabBar(pathname)) {
|
|
1575
1594
|
if (handler.isSamePage(currentPage))
|
|
1576
1595
|
return;
|
|
1577
1596
|
if (handler.isTabBar(currentPage.path)) {
|
|
@@ -1589,8 +1608,8 @@ function createRouter(history$1, app, config, framework) {
|
|
|
1589
1608
|
handler.unload(currentPage, stacks.length, true);
|
|
1590
1609
|
}
|
|
1591
1610
|
}
|
|
1592
|
-
if (cacheTabs[
|
|
1593
|
-
stacks.popTab(
|
|
1611
|
+
if (cacheTabs[pathname]) {
|
|
1612
|
+
stacks.popTab(pathname);
|
|
1594
1613
|
return handler.show(stacks.getItem(0), pageConfig, 0);
|
|
1595
1614
|
}
|
|
1596
1615
|
shouldLoad = true;
|
package/dist/index.esm.js
CHANGED
|
@@ -14,7 +14,8 @@ import UniversalRouter from 'universal-router';
|
|
|
14
14
|
function loadAnimateStyle(ms = 300) {
|
|
15
15
|
const css = `
|
|
16
16
|
body {
|
|
17
|
-
|
|
17
|
+
/* 防止 iOS 页面滚动 */
|
|
18
|
+
overflow: hidden;
|
|
18
19
|
}
|
|
19
20
|
.taro_router > .taro_page {
|
|
20
21
|
position: absolute;
|
|
@@ -43,7 +44,7 @@ body {
|
|
|
43
44
|
/**
|
|
44
45
|
* 插入路由相关样式
|
|
45
46
|
*/
|
|
46
|
-
function loadRouterStyle(enableTabBar, enableWindowScroll) {
|
|
47
|
+
function loadRouterStyle(enableTabBar, enableWindowScroll, enhanceAnimation) {
|
|
47
48
|
const css = `
|
|
48
49
|
.taro_router {
|
|
49
50
|
position: relative;
|
|
@@ -71,11 +72,15 @@ ${enableTabBar ? `
|
|
|
71
72
|
}
|
|
72
73
|
|
|
73
74
|
` : ''}
|
|
74
|
-
|
|
75
|
+
${enhanceAnimation
|
|
76
|
+
? `.taro_page_shade:has(+.taro_page_stationed),
|
|
75
77
|
.taro_page_shade.taro_tabbar_page,
|
|
76
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) {
|
|
77
79
|
display: none;
|
|
78
|
-
}
|
|
80
|
+
}` : ` .taro_page_shade,
|
|
81
|
+
.taro_router > .taro_page.taro_page_show.taro_page_stationed:not(.taro_page_shade):not(.taro_tabbar_page):not(:last-child) {
|
|
82
|
+
display: none;
|
|
83
|
+
}`}
|
|
79
84
|
`;
|
|
80
85
|
addStyle(css);
|
|
81
86
|
}
|
|
@@ -141,7 +146,7 @@ function loadNavigationBarStyle() {
|
|
|
141
146
|
to {
|
|
142
147
|
transform: rotate(360deg);
|
|
143
148
|
}
|
|
144
|
-
}
|
|
149
|
+
}
|
|
145
150
|
|
|
146
151
|
.taro-navigation-bar-no-icon > .taro-navigation-bar-home {
|
|
147
152
|
display: none;
|
|
@@ -572,6 +577,7 @@ function navigate(option, method) {
|
|
|
572
577
|
const pathPieces = processNavigateUrl(option);
|
|
573
578
|
const state = { timestamp: Date.now() };
|
|
574
579
|
if (method === 'navigateTo') {
|
|
580
|
+
// Note: 由于 spa 会针对弱网情况下,短时间内多次跳转同一个页面跳转加了锁,后续如果有用户反馈返回无效,那可能是这个问题
|
|
575
581
|
history.push(pathPieces, state);
|
|
576
582
|
}
|
|
577
583
|
else if (method === 'redirectTo' || method === 'switchTab') {
|
|
@@ -1255,7 +1261,7 @@ class PageHandler {
|
|
|
1255
1261
|
this.pathname = history.location.pathname;
|
|
1256
1262
|
// Note: 注入页面样式
|
|
1257
1263
|
this.animation && loadAnimateStyle(this.animationDuration);
|
|
1258
|
-
loadRouterStyle(this.tabBarList.length > 1, this.usingWindowScroll);
|
|
1264
|
+
loadRouterStyle(this.tabBarList.length > 1, this.usingWindowScroll, this.router.enhanceAnimation);
|
|
1259
1265
|
}
|
|
1260
1266
|
onReady(page, onLoad = true) {
|
|
1261
1267
|
var _a;
|
|
@@ -1379,7 +1385,7 @@ class PageHandler {
|
|
|
1379
1385
|
}
|
|
1380
1386
|
}
|
|
1381
1387
|
hide(page, animation = false) {
|
|
1382
|
-
var _a, _b, _c, _d, _e, _f, _g;
|
|
1388
|
+
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
1383
1389
|
if (!page)
|
|
1384
1390
|
return;
|
|
1385
1391
|
// NOTE: 修复多页并发问题,此处可能因为路由跳转过快,执行时页面可能还没有创建成功
|
|
@@ -1404,6 +1410,7 @@ class PageHandler {
|
|
|
1404
1410
|
this.hideTimer = null;
|
|
1405
1411
|
(_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');
|
|
1406
1412
|
}
|
|
1413
|
+
(_h = page.onHide) === null || _h === void 0 ? void 0 : _h.call(page);
|
|
1407
1414
|
pageEl.classList.add('taro_page_shade');
|
|
1408
1415
|
this.lastHidePage = pageEl;
|
|
1409
1416
|
}
|
|
@@ -1477,6 +1484,10 @@ function createRouter(history, app, config, framework) {
|
|
|
1477
1484
|
}
|
|
1478
1485
|
RouterConfig.config = config;
|
|
1479
1486
|
const handler = new PageHandler(config, history);
|
|
1487
|
+
// Note: 弱网情况下,快速切换 tab,会造成同个页面实例被多次挂在到页面上,原因是资源请求是异步的,短时间内发起多个请求,
|
|
1488
|
+
// 会在资源加载完成后,同时走到挂载的逻辑,造成 pageStampId 更新不及时,两个 page 的Id 相同,后面很多操作是通过 getElementById 来进行的
|
|
1489
|
+
// 所以需要加一个锁来应对这个情况
|
|
1490
|
+
const pageLock = {};
|
|
1480
1491
|
routesAlias.set(handler.router.customRoutes);
|
|
1481
1492
|
const basename = handler.router.basename;
|
|
1482
1493
|
const routes = handler.routes.map(route => {
|
|
@@ -1500,24 +1511,30 @@ function createRouter(history, app, config, framework) {
|
|
|
1500
1511
|
app.onError && window.addEventListener('error', e => { var _a; return (_a = app.onError) === null || _a === void 0 ? void 0 : _a.call(app, e.message); });
|
|
1501
1512
|
const render = ({ location, action }) => __awaiter(this, void 0, void 0, function* () {
|
|
1502
1513
|
var _c, _d, _e, _f, _g, _h, _j, _k;
|
|
1503
|
-
|
|
1514
|
+
// Note: 由于下面有异步加载操作 先不要在这里去设置 handler.pathname
|
|
1515
|
+
const currentPathname = decodeURI(location.pathname);
|
|
1504
1516
|
if ((_c = window.__taroAppConfig) === null || _c === void 0 ? void 0 : _c.usingWindowScroll)
|
|
1505
1517
|
window.scrollTo(0, 0);
|
|
1506
1518
|
eventCenter.trigger('__taroRouterChange', {
|
|
1507
1519
|
toLocation: {
|
|
1508
|
-
path:
|
|
1520
|
+
path: currentPathname
|
|
1509
1521
|
}
|
|
1510
1522
|
});
|
|
1511
|
-
let element, params;
|
|
1523
|
+
let element, context, params;
|
|
1524
|
+
const routerPath = handler.router.forcePath || currentPathname;
|
|
1525
|
+
pageLock[routerPath] = typeof pageLock[routerPath] === 'number' ? pageLock[routerPath] + 1 : 1;
|
|
1526
|
+
const currentLock = pageLock[routerPath];
|
|
1527
|
+
let postLock;
|
|
1512
1528
|
try {
|
|
1513
|
-
const result = yield router.resolve(
|
|
1514
|
-
[element, , params] = yield Promise.all(result);
|
|
1529
|
+
const result = yield router.resolve(routerPath);
|
|
1530
|
+
[element, context, params] = yield Promise.all(result);
|
|
1531
|
+
postLock = pageLock[routerPath];
|
|
1515
1532
|
}
|
|
1516
1533
|
catch (error) {
|
|
1517
1534
|
if (error.status === 404) {
|
|
1518
1535
|
const notFoundEvent = {
|
|
1519
1536
|
isEntryPage: stacks.length === 0,
|
|
1520
|
-
path:
|
|
1537
|
+
path: currentPathname,
|
|
1521
1538
|
query: handler.getQuery(createStampId()),
|
|
1522
1539
|
};
|
|
1523
1540
|
(_d = app.onPageNotFound) === null || _d === void 0 ? void 0 : _d.call(app, notFoundEvent);
|
|
@@ -1531,9 +1548,12 @@ function createRouter(history, app, config, framework) {
|
|
|
1531
1548
|
throw error;
|
|
1532
1549
|
}
|
|
1533
1550
|
}
|
|
1534
|
-
if (!element)
|
|
1551
|
+
if (!element || currentLock !== postLock)
|
|
1535
1552
|
return;
|
|
1536
|
-
|
|
1553
|
+
// Note: 异步结束后,在设置 handler.pathname
|
|
1554
|
+
// context.pathname 在 universal-router 被处理过了,是发起资源请求的时候传入的 pathname,即 await router.resolve(routerPath) 这个 routerPath
|
|
1555
|
+
handler.pathname = context.pathname;
|
|
1556
|
+
const { pathname, pageConfig } = handler;
|
|
1537
1557
|
let enablePullDownRefresh = ((_e = config === null || config === void 0 ? void 0 : config.window) === null || _e === void 0 ? void 0 : _e.enablePullDownRefresh) || false;
|
|
1538
1558
|
let navigationStyle = ((_f = config === null || config === void 0 ? void 0 : config.window) === null || _f === void 0 ? void 0 : _f.navigationStyle) || 'default';
|
|
1539
1559
|
let navigationBarTextStyle = ((_g = config === null || config === void 0 ? void 0 : config.window) === null || _g === void 0 ? void 0 : _g.navigationBarTextStyle) || 'white';
|
|
@@ -1554,7 +1574,6 @@ function createRouter(history, app, config, framework) {
|
|
|
1554
1574
|
}
|
|
1555
1575
|
eventCenter.trigger('__taroSetNavigationStyle', navigationStyle, navigationBarTextStyle, navigationBarBackgroundColor);
|
|
1556
1576
|
const currentPage = Current.page;
|
|
1557
|
-
const pathname = handler.pathname;
|
|
1558
1577
|
const methodName = (_j = stacks.method) !== null && _j !== void 0 ? _j : '';
|
|
1559
1578
|
const cacheTabs = stacks.getTabs();
|
|
1560
1579
|
let shouldLoad = false;
|
|
@@ -1570,7 +1589,7 @@ function createRouter(history, app, config, framework) {
|
|
|
1570
1589
|
}
|
|
1571
1590
|
shouldLoad = true;
|
|
1572
1591
|
}
|
|
1573
|
-
else if (currentPage && handler.isTabBar(
|
|
1592
|
+
else if (currentPage && handler.isTabBar(pathname)) {
|
|
1574
1593
|
if (handler.isSamePage(currentPage))
|
|
1575
1594
|
return;
|
|
1576
1595
|
if (handler.isTabBar(currentPage.path)) {
|
|
@@ -1588,8 +1607,8 @@ function createRouter(history, app, config, framework) {
|
|
|
1588
1607
|
handler.unload(currentPage, stacks.length, true);
|
|
1589
1608
|
}
|
|
1590
1609
|
}
|
|
1591
|
-
if (cacheTabs[
|
|
1592
|
-
stacks.popTab(
|
|
1610
|
+
if (cacheTabs[pathname]) {
|
|
1611
|
+
stacks.popTab(pathname);
|
|
1593
1612
|
return handler.show(stacks.getItem(0), pageConfig, 0);
|
|
1594
1613
|
}
|
|
1595
1614
|
shouldLoad = true;
|
package/dist/router/page.js
CHANGED
|
@@ -123,7 +123,7 @@ class PageHandler {
|
|
|
123
123
|
this.pathname = history.location.pathname;
|
|
124
124
|
// Note: 注入页面样式
|
|
125
125
|
this.animation && loadAnimateStyle(this.animationDuration);
|
|
126
|
-
loadRouterStyle(this.tabBarList.length > 1, this.usingWindowScroll);
|
|
126
|
+
loadRouterStyle(this.tabBarList.length > 1, this.usingWindowScroll, this.router.enhanceAnimation);
|
|
127
127
|
}
|
|
128
128
|
onReady(page, onLoad = true) {
|
|
129
129
|
var _a;
|
|
@@ -247,7 +247,7 @@ class PageHandler {
|
|
|
247
247
|
}
|
|
248
248
|
}
|
|
249
249
|
hide(page, animation = false) {
|
|
250
|
-
var _a, _b, _c, _d, _e, _f, _g;
|
|
250
|
+
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
251
251
|
if (!page)
|
|
252
252
|
return;
|
|
253
253
|
// NOTE: 修复多页并发问题,此处可能因为路由跳转过快,执行时页面可能还没有创建成功
|
|
@@ -272,6 +272,7 @@ class PageHandler {
|
|
|
272
272
|
this.hideTimer = null;
|
|
273
273
|
(_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');
|
|
274
274
|
}
|
|
275
|
+
(_h = page.onHide) === null || _h === void 0 ? void 0 : _h.call(page);
|
|
275
276
|
pageEl.classList.add('taro_page_shade');
|
|
276
277
|
this.lastHidePage = pageEl;
|
|
277
278
|
}
|
package/dist/router/spa.js
CHANGED
|
@@ -17,6 +17,10 @@ function createRouter(history, app, config, framework) {
|
|
|
17
17
|
}
|
|
18
18
|
RouterConfig.config = config;
|
|
19
19
|
const handler = new PageHandler(config, history);
|
|
20
|
+
// Note: 弱网情况下,快速切换 tab,会造成同个页面实例被多次挂在到页面上,原因是资源请求是异步的,短时间内发起多个请求,
|
|
21
|
+
// 会在资源加载完成后,同时走到挂载的逻辑,造成 pageStampId 更新不及时,两个 page 的Id 相同,后面很多操作是通过 getElementById 来进行的
|
|
22
|
+
// 所以需要加一个锁来应对这个情况
|
|
23
|
+
const pageLock = {};
|
|
20
24
|
routesAlias.set(handler.router.customRoutes);
|
|
21
25
|
const basename = handler.router.basename;
|
|
22
26
|
const routes = handler.routes.map(route => {
|
|
@@ -40,24 +44,30 @@ function createRouter(history, app, config, framework) {
|
|
|
40
44
|
app.onError && window.addEventListener('error', e => { var _a; return (_a = app.onError) === null || _a === void 0 ? void 0 : _a.call(app, e.message); });
|
|
41
45
|
const render = ({ location, action }) => __awaiter(this, void 0, void 0, function* () {
|
|
42
46
|
var _c, _d, _e, _f, _g, _h, _j, _k;
|
|
43
|
-
|
|
47
|
+
// Note: 由于下面有异步加载操作 先不要在这里去设置 handler.pathname
|
|
48
|
+
const currentPathname = decodeURI(location.pathname);
|
|
44
49
|
if ((_c = window.__taroAppConfig) === null || _c === void 0 ? void 0 : _c.usingWindowScroll)
|
|
45
50
|
window.scrollTo(0, 0);
|
|
46
51
|
eventCenter.trigger('__taroRouterChange', {
|
|
47
52
|
toLocation: {
|
|
48
|
-
path:
|
|
53
|
+
path: currentPathname
|
|
49
54
|
}
|
|
50
55
|
});
|
|
51
|
-
let element, params;
|
|
56
|
+
let element, context, params;
|
|
57
|
+
const routerPath = handler.router.forcePath || currentPathname;
|
|
58
|
+
pageLock[routerPath] = typeof pageLock[routerPath] === 'number' ? pageLock[routerPath] + 1 : 1;
|
|
59
|
+
const currentLock = pageLock[routerPath];
|
|
60
|
+
let postLock;
|
|
52
61
|
try {
|
|
53
|
-
const result = yield router.resolve(
|
|
54
|
-
[element, , params] = yield Promise.all(result);
|
|
62
|
+
const result = yield router.resolve(routerPath);
|
|
63
|
+
[element, context, params] = yield Promise.all(result);
|
|
64
|
+
postLock = pageLock[routerPath];
|
|
55
65
|
}
|
|
56
66
|
catch (error) {
|
|
57
67
|
if (error.status === 404) {
|
|
58
68
|
const notFoundEvent = {
|
|
59
69
|
isEntryPage: stacks.length === 0,
|
|
60
|
-
path:
|
|
70
|
+
path: currentPathname,
|
|
61
71
|
query: handler.getQuery(createStampId()),
|
|
62
72
|
};
|
|
63
73
|
(_d = app.onPageNotFound) === null || _d === void 0 ? void 0 : _d.call(app, notFoundEvent);
|
|
@@ -71,9 +81,12 @@ function createRouter(history, app, config, framework) {
|
|
|
71
81
|
throw error;
|
|
72
82
|
}
|
|
73
83
|
}
|
|
74
|
-
if (!element)
|
|
84
|
+
if (!element || currentLock !== postLock)
|
|
75
85
|
return;
|
|
76
|
-
|
|
86
|
+
// Note: 异步结束后,在设置 handler.pathname
|
|
87
|
+
// context.pathname 在 universal-router 被处理过了,是发起资源请求的时候传入的 pathname,即 await router.resolve(routerPath) 这个 routerPath
|
|
88
|
+
handler.pathname = context.pathname;
|
|
89
|
+
const { pathname, pageConfig } = handler;
|
|
77
90
|
let enablePullDownRefresh = ((_e = config === null || config === void 0 ? void 0 : config.window) === null || _e === void 0 ? void 0 : _e.enablePullDownRefresh) || false;
|
|
78
91
|
let navigationStyle = ((_f = config === null || config === void 0 ? void 0 : config.window) === null || _f === void 0 ? void 0 : _f.navigationStyle) || 'default';
|
|
79
92
|
let navigationBarTextStyle = ((_g = config === null || config === void 0 ? void 0 : config.window) === null || _g === void 0 ? void 0 : _g.navigationBarTextStyle) || 'white';
|
|
@@ -94,7 +107,6 @@ function createRouter(history, app, config, framework) {
|
|
|
94
107
|
}
|
|
95
108
|
eventCenter.trigger('__taroSetNavigationStyle', navigationStyle, navigationBarTextStyle, navigationBarBackgroundColor);
|
|
96
109
|
const currentPage = Current.page;
|
|
97
|
-
const pathname = handler.pathname;
|
|
98
110
|
const methodName = (_j = stacks.method) !== null && _j !== void 0 ? _j : '';
|
|
99
111
|
const cacheTabs = stacks.getTabs();
|
|
100
112
|
let shouldLoad = false;
|
|
@@ -110,7 +122,7 @@ function createRouter(history, app, config, framework) {
|
|
|
110
122
|
}
|
|
111
123
|
shouldLoad = true;
|
|
112
124
|
}
|
|
113
|
-
else if (currentPage && handler.isTabBar(
|
|
125
|
+
else if (currentPage && handler.isTabBar(pathname)) {
|
|
114
126
|
if (handler.isSamePage(currentPage))
|
|
115
127
|
return;
|
|
116
128
|
if (handler.isTabBar(currentPage.path)) {
|
|
@@ -128,8 +140,8 @@ function createRouter(history, app, config, framework) {
|
|
|
128
140
|
handler.unload(currentPage, stacks.length, true);
|
|
129
141
|
}
|
|
130
142
|
}
|
|
131
|
-
if (cacheTabs[
|
|
132
|
-
stacks.popTab(
|
|
143
|
+
if (cacheTabs[pathname]) {
|
|
144
|
+
stacks.popTab(pathname);
|
|
133
145
|
return handler.show(stacks.getItem(0), pageConfig, 0);
|
|
134
146
|
}
|
|
135
147
|
shouldLoad = true;
|
package/dist/style.d.ts
CHANGED
|
@@ -5,7 +5,7 @@ declare function loadAnimateStyle(ms?: number): void;
|
|
|
5
5
|
/**
|
|
6
6
|
* 插入路由相关样式
|
|
7
7
|
*/
|
|
8
|
-
declare function loadRouterStyle(enableTabBar: boolean, enableWindowScroll: boolean): void;
|
|
8
|
+
declare function loadRouterStyle(enableTabBar: boolean, enableWindowScroll: boolean, enhanceAnimation?: boolean): void;
|
|
9
9
|
/**
|
|
10
10
|
* 插入导航栏相关的样式
|
|
11
11
|
*/
|
package/dist/style.js
CHANGED
|
@@ -4,7 +4,8 @@
|
|
|
4
4
|
function loadAnimateStyle(ms = 300) {
|
|
5
5
|
const css = `
|
|
6
6
|
body {
|
|
7
|
-
|
|
7
|
+
/* 防止 iOS 页面滚动 */
|
|
8
|
+
overflow: hidden;
|
|
8
9
|
}
|
|
9
10
|
.taro_router > .taro_page {
|
|
10
11
|
position: absolute;
|
|
@@ -33,7 +34,7 @@ body {
|
|
|
33
34
|
/**
|
|
34
35
|
* 插入路由相关样式
|
|
35
36
|
*/
|
|
36
|
-
function loadRouterStyle(enableTabBar, enableWindowScroll) {
|
|
37
|
+
function loadRouterStyle(enableTabBar, enableWindowScroll, enhanceAnimation) {
|
|
37
38
|
const css = `
|
|
38
39
|
.taro_router {
|
|
39
40
|
position: relative;
|
|
@@ -61,11 +62,15 @@ ${enableTabBar ? `
|
|
|
61
62
|
}
|
|
62
63
|
|
|
63
64
|
` : ''}
|
|
64
|
-
|
|
65
|
+
${enhanceAnimation
|
|
66
|
+
? `.taro_page_shade:has(+.taro_page_stationed),
|
|
65
67
|
.taro_page_shade.taro_tabbar_page,
|
|
66
68
|
.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) {
|
|
67
69
|
display: none;
|
|
68
|
-
}
|
|
70
|
+
}` : ` .taro_page_shade,
|
|
71
|
+
.taro_router > .taro_page.taro_page_show.taro_page_stationed:not(.taro_page_shade):not(.taro_tabbar_page):not(:last-child) {
|
|
72
|
+
display: none;
|
|
73
|
+
}`}
|
|
69
74
|
`;
|
|
70
75
|
addStyle(css);
|
|
71
76
|
}
|
|
@@ -131,7 +136,7 @@ function loadNavigationBarStyle() {
|
|
|
131
136
|
to {
|
|
132
137
|
transform: rotate(360deg);
|
|
133
138
|
}
|
|
134
|
-
}
|
|
139
|
+
}
|
|
135
140
|
|
|
136
141
|
.taro-navigation-bar-no-icon > .taro-navigation-bar-home {
|
|
137
142
|
display: none;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tarojs/router",
|
|
3
|
-
"version": "3.6.
|
|
3
|
+
"version": "3.6.31-alpha.0",
|
|
4
4
|
"description": "Taro-router",
|
|
5
5
|
"browser": "dist/index.js",
|
|
6
6
|
"main:h5": "dist/index.esm.js",
|
|
@@ -44,14 +44,14 @@
|
|
|
44
44
|
"rollup-plugin-ts": "^3.0.2",
|
|
45
45
|
"ts-jest": "^29.0.5",
|
|
46
46
|
"typescript": "^4.7.4",
|
|
47
|
-
"@tarojs/runtime": "3.6.
|
|
48
|
-
"@tarojs/shared": "3.6.
|
|
49
|
-
"@tarojs/taro": "3.6.
|
|
47
|
+
"@tarojs/runtime": "3.6.31-alpha.0",
|
|
48
|
+
"@tarojs/shared": "3.6.31-alpha.0",
|
|
49
|
+
"@tarojs/taro": "3.6.31-alpha.0"
|
|
50
50
|
},
|
|
51
51
|
"peerDependencies": {
|
|
52
|
-
"@tarojs/runtime": "3.6.
|
|
53
|
-
"@tarojs/
|
|
54
|
-
"@tarojs/
|
|
52
|
+
"@tarojs/runtime": "3.6.31-alpha.0",
|
|
53
|
+
"@tarojs/taro": "3.6.31-alpha.0",
|
|
54
|
+
"@tarojs/shared": "3.6.31-alpha.0"
|
|
55
55
|
},
|
|
56
56
|
"scripts": {
|
|
57
57
|
"prebuild": "pnpm run clean",
|
package/types/router.d.ts
CHANGED
|
@@ -12,6 +12,8 @@ export interface Router {
|
|
|
12
12
|
customRoutes?: Record<string, string | string[]>
|
|
13
13
|
pathname: string
|
|
14
14
|
forcePath?: string
|
|
15
|
+
/** 加上这个参数,可以解决返回页面的时候白屏的问题,但是某些不支持 :has() 选择器的浏览器会有问题 */
|
|
16
|
+
enhanceAnimation?: boolean
|
|
15
17
|
}
|
|
16
18
|
|
|
17
19
|
export interface SpaRouterConfig extends AppConfig {
|