@tarojs/router 3.5.8 → 3.5.9

package/dist/index.esm.js

@@ -1,5 +1,5 @@
 import { createBrowserHistory, createHashHistory, Action, parsePath } from 'history';
-import { Current, eventCenter, createPageConfig, hooks, stringify, requestAnimationFrame } from '@tarojs/runtime';
+import { Current, incrementId, eventCenter, createPageConfig, hooks, stringify, requestAnimationFrame } from '@tarojs/runtime';
 import MobileDetect from 'mobile-detect';
 import queryString from 'query-string';
 import { initTabBarApis } from '@tarojs/taro';
@@ -202,6 +202,8 @@ class Stacks {
     constructor() {
         this.stacks = [];
         this.backDelta = 0;
+        this.tabs = {};
+        this.methodName = '';
     }
     set delta(delta) {
         if (delta > 0) {
@@ -217,6 +219,12 @@ class Stacks {
     get delta() {
         return this.backDelta;
     }
+    set method(methodName) {
+        this.methodName = methodName;
+    }
+    get method() {
+        return this.methodName;
+    }
     get length() {
         return this.stacks.length;
     }
@@ -254,6 +262,20 @@ class Stacks {
     push(page) {
         return this.stacks.push(page);
     }
+    getTabs() {
+        return this.tabs;
+    }
+    pushTab(path) {
+        this.tabs[path] = this.last;
+        this.pop();
+    }
+    popTab(path) {
+        this.push(this.tabs[path]);
+        delete this.tabs[path];
+    }
+    removeTab(path) {
+        delete this.tabs[path];
+    }
 }
 const stacks = new Stacks();
 
@@ -284,6 +306,7 @@ function processNavigateUrl(option) {
 function navigate(option, method) {
     return __awaiter(this, void 0, void 0, function* () {
         return new Promise((resolve, reject) => {
+            stacks.method = method;
             const { success, complete, fail } = option;
             const unListen = history.listen(() => {
                 const res = { errMsg: `${method}:ok` };
@@ -562,6 +585,8 @@ class MultiPageHandler {
     }
 }
 
+const createStampId$1 = incrementId();
+const launchStampId$1 = createStampId$1();
 // TODO 支持多路由 (APP 生命周期仅触发一次)
 /** Note: 关于多页面应用
  * - 需要配置路由映射（根目录跳转、404 页面……）
@@ -577,7 +602,7 @@ function createMultiRouter(app, config, framework) {
         const handler = new MultiPageHandler(config);
         const launchParam = {
             path: config.pageName,
-            query: handler.getQuery(),
+            query: handler.getQuery(launchStampId$1),
             scene: 0,
             shareTicket: '',
             referrerInfo: {}
@@ -700,9 +725,9 @@ class PageHandler {
             return [pagePath, homePage].includes(routePath) || ((_a = routesAlias.getConfig(pagePath)) === null || _a === void 0 ? void 0 : _a.includes(routePath));
         });
     }
-    get isTabBar() {
+    isTabBar(pathname) {
         var _a;
-        const routePath = addLeadingSlash(stripBasename(this.pathname, this.basename));
+        const routePath = addLeadingSlash(stripBasename(pathname, this.basename)).split('?')[0];
         const pagePath = ((_a = Object.entries(this.customRoutes).find(([, target]) => {
             if (typeof target === 'string') {
                 return target === routePath;
@@ -738,12 +763,12 @@ class PageHandler {
         }
         return search.substr(1);
     }
-    getQuery(stamp = 0, search = '', options = {}) {
+    getQuery(stamp = '', search = '', options = {}) {
         search = search ? `${search}&${this.search}` : this.search;
         const query = search
             ? queryString.parse(search, { decode: false })
             : {};
-        query.stamp = stamp.toString();
+        query.stamp = stamp;
         return Object.assign(Object.assign({}, query), options);
     }
     mount() {
@@ -786,18 +811,18 @@ class PageHandler {
             onLoad && (pageEl['__page'] = page);
         }
     }
-    load(page, pageConfig = {}, stacksIndex = 0) {
+    load(page, pageConfig = {}, stampId, pageNo = 0) {
         var _a, _b;
         if (!page)
             return;
         // NOTE: 页面栈推入太晚可能导致 getCurrentPages 无法获取到当前页面实例
         stacks.push(page);
-        const param = this.getQuery(stacks.length, '', page.options);
+        const param = this.getQuery(stampId, '', page.options);
         let pageEl = this.getPageContainer(page);
         if (pageEl) {
             setDisplay(pageEl);
-            this.isTabBar && pageEl.classList.add('taro_tabbar_page');
-            this.addAnimation(pageEl, stacksIndex === 0);
+            this.isTabBar(this.pathname) && pageEl.classList.add('taro_tabbar_page');
+            this.addAnimation(pageEl, pageNo === 0);
             (_a = page.onShow) === null || _a === void 0 ? void 0 : _a.call(page);
             this.bindPageEvents(page, pageEl, pageConfig);
         }
@@ -805,8 +830,8 @@ class PageHandler {
             (_b = page.onLoad) === null || _b === void 0 ? void 0 : _b.call(page, param, () => {
                 var _a;
                 pageEl = this.getPageContainer(page);
-                this.isTabBar && (pageEl === null || pageEl === void 0 ? void 0 : pageEl.classList.add('taro_tabbar_page'));
-                this.addAnimation(pageEl, stacksIndex === 0);
+                this.isTabBar(this.pathname) && (pageEl === null || pageEl === void 0 ? void 0 : pageEl.classList.add('taro_tabbar_page'));
+                this.addAnimation(pageEl, pageNo === 0);
                 this.onReady(page, true);
                 (_a = page.onShow) === null || _a === void 0 ? void 0 : _a.call(page);
                 this.bindPageEvents(page, pageEl, pageConfig);
@@ -844,15 +869,15 @@ class PageHandler {
         if (delta >= 1)
             this.unload(stacks.last, delta);
     }
-    show(page, pageConfig = {}, stacksIndex = 0) {
+    show(page, pageConfig = {}, pageNo = 0) {
         var _a, _b;
         if (!page)
             return;
-        const param = this.getQuery(stacks.length, '', page.options);
+        const param = this.getQuery(page['$taroParams']['stamp'], '', page.options);
         let pageEl = this.getPageContainer(page);
         if (pageEl) {
             setDisplay(pageEl);
-            this.addAnimation(pageEl, stacksIndex === 0);
+            this.addAnimation(pageEl, pageNo === 0);
             (_a = page.onShow) === null || _a === void 0 ? void 0 : _a.call(page);
             this.bindPageEvents(page, pageEl, pageConfig);
         }
@@ -860,7 +885,7 @@ class PageHandler {
             (_b = page.onLoad) === null || _b === void 0 ? void 0 : _b.call(page, param, () => {
                 var _a;
                 pageEl = this.getPageContainer(page);
-                this.addAnimation(pageEl, stacksIndex === 0);
+                this.addAnimation(pageEl, pageNo === 0);
                 this.onReady(page, false);
                 (_a = page.onShow) === null || _a === void 0 ? void 0 : _a.call(page);
                 this.bindPageEvents(page, pageEl, pageConfig);
@@ -930,6 +955,8 @@ class PageHandler {
     }
 }
 
+const createStampId = incrementId();
+let launchStampId = createStampId();
 function createRouter(app, config, framework) {
     var _a, _b;
     RouterConfig.config = config;
@@ -947,7 +974,7 @@ function createRouter(app, config, framework) {
     const router = new UniversalRouter(routes, { baseUrl: basename || '' });
     const launchParam = {
         path: handler.homePage,
-        query: handler.getQuery(stacks.length),
+        query: handler.getQuery(launchStampId),
         scene: 0,
         shareTicket: '',
         referrerInfo: {}
@@ -956,7 +983,7 @@ function createRouter(app, config, framework) {
     (_a = app.onLaunch) === null || _a === void 0 ? void 0 : _a.call(app, launchParam);
     app.onError && window.addEventListener('error', e => { var _a; return (_a = app.onError) === null || _a === void 0 ? void 0 : _a.call(app, e.message); });
     const render = ({ location, action }) => __awaiter(this, void 0, void 0, function* () {
-        var _c, _d, _e, _f, _g;
+        var _c, _d, _e, _f, _g, _h;
         handler.pathname = decodeURI(location.pathname);
         eventCenter.trigger('__taroRouterChange', {
             toLocation: {
@@ -995,8 +1022,45 @@ function createRouter(app, config, framework) {
         }
         const currentPage = Current.page;
         const pathname = handler.pathname;
+        const methodName = (_g = stacks.method) !== null && _g !== void 0 ? _g : '';
+        const cacheTabs = stacks.getTabs();
         let shouldLoad = false;
-        if (action === 'POP') {
+        stacks.method = '';
+        if (methodName === 'reLaunch') {
+            handler.unload(currentPage, stacks.length);
+            // NOTE: 同时卸载缓存在tabs里面的页面实例
+            for (const key in cacheTabs) {
+                if (cacheTabs[key]) {
+                    handler.unload(cacheTabs[key]);
+                    stacks.removeTab(key);
+                }
+            }
+            shouldLoad = true;
+        }
+        else if (handler.isTabBar(handler.pathname)) {
+            if (handler.isSamePage(currentPage))
+                return;
+            if (handler.isTabBar(currentPage.path)) {
+                handler.hide(currentPage);
+                stacks.pushTab(currentPage.path.split('?')[0]);
+            }
+            else if (stacks.length > 0) {
+                const firstIns = stacks.getItem(0);
+                if (handler.isTabBar(firstIns.path)) {
+                    handler.unload(currentPage, stacks.length - 1);
+                    stacks.pushTab(firstIns.path.split('?')[0]);
+                }
+                else {
+                    handler.unload(currentPage, stacks.length);
+                }
+            }
+            if (cacheTabs[handler.pathname]) {
+                stacks.popTab(handler.pathname);
+                return handler.show(stacks.getItem(0), pageConfig, 0);
+            }
+            shouldLoad = true;
+        }
+        else if (action === 'POP') {
             // NOTE: 浏览器事件退后多次时，该事件只会被触发一次
             const prevIndex = stacks.getPrevIndex(pathname);
             const delta = stacks.getDelta(pathname);
@@ -1011,37 +1075,34 @@ function createRouter(app, config, framework) {
                 }
             }
         }
-        else {
-            if (handler.isTabBar) {
-                if (handler.isSamePage(currentPage))
-                    return;
-                const prevIndex = stacks.getPrevIndex(pathname, 0);
-                handler.hide(currentPage);
-                if (prevIndex > -1) {
-                    // NOTE: tabbar 页且之前出现过，直接复用
-                    return handler.show(stacks.getItem(prevIndex), pageConfig, prevIndex);
-                }
-            }
-            else if (action === 'REPLACE') {
-                const delta = stacks.getDelta(pathname);
-                // NOTE: 页面路由记录并不会清空，只是移除掉缓存的 stack 以及页面
-                handler.unload(currentPage, delta);
-            }
-            else if (action === 'PUSH') {
-                handler.hide(currentPage);
-            }
+        else if (action === 'REPLACE') {
+            const delta = stacks.getDelta(pathname);
+            // NOTE: 页面路由记录并不会清空，只是移除掉缓存的 stack 以及页面
+            handler.unload(currentPage, delta);
+            shouldLoad = true;
+        }
+        else if (action === 'PUSH') {
+            handler.hide(currentPage);
             shouldLoad = true;
         }
         if (shouldLoad || stacks.length < 1) {
-            const el = (_g = element.default) !== null && _g !== void 0 ? _g : element;
+            const el = (_h = element.default) !== null && _h !== void 0 ? _h : element;
             const loadConfig = Object.assign({}, pageConfig);
             const stacksIndex = stacks.length;
             delete loadConfig['path'];
             delete loadConfig['load'];
-            const page = createPageConfig(enablePullDownRefresh ? hooks.call('createPullDownComponent', el, location.pathname, framework, handler.PullDownRefresh) : el, pathname + stringify(handler.getQuery(stacksIndex)), {}, loadConfig);
+            let pageStampId = '';
+            if (launchStampId) {
+                pageStampId = launchStampId;
+                launchStampId = '';
+            }
+            else {
+                pageStampId = createStampId();
+            }
+            const page = createPageConfig(enablePullDownRefresh ? hooks.call('createPullDownComponent', el, location.pathname, framework, handler.PullDownRefresh) : el, pathname + stringify(handler.getQuery(pageStampId)), {}, loadConfig);
             if (params)
                 page.options = params;
-            return handler.load(page, pageConfig, stacksIndex);
+            return handler.load(page, pageConfig, pageStampId, stacksIndex);
         }
     });
     const routePath = addLeadingSlash(stripBasename(history.location.pathname, handler.basename));