@tarojs/router 3.3.17 → 3.3.18

package/dist/index.js

@@ -58,8 +58,18 @@ function prependBasename(url) {
 
     return basename.replace(/\/$/, '') + '/' + url.replace(/^\//, '');
 }
-var hasBasename = function (path, prefix) { return new RegExp('^' + prefix + '(\\/|\\?|#|$)', 'i').test(path); };
-var stripBasename = function (path, prefix) { return hasBasename(path, prefix) ? path.substr(prefix.length) : path; };
+var hasBasename = function (path, prefix) {
+    if ( path === void 0 ) path = '';
+    if ( prefix === void 0 ) prefix = '';
+
+    return new RegExp('^' + prefix + '(\\/|\\?|#|$)', 'i').test(path);
+};
+var stripBasename = function (path, prefix) {
+    if ( path === void 0 ) path = '';
+    if ( prefix === void 0 ) prefix = '';
+
+    return hasBasename(path, prefix) ? path.substr(prefix.length) : path;
+};
 
 var Stacks = function Stacks() {
     this.stacks = [];
@@ -87,9 +97,11 @@ Stacks.prototype.get = function get () {
 Stacks.prototype.getItem = function getItem (index) {
     return this.stacks[index];
 };
-Stacks.prototype.getLastIndex = function getLastIndex (pathname) {
+Stacks.prototype.getLastIndex = function getLastIndex (pathname, stateWith) {
+        if ( stateWith === void 0 ) stateWith = 1;
+
     var list = [].concat( this.stacks ).reverse();
-    return list.findIndex(function (page, i) { var _a; return i !== 0 && ((_a = page.path) === null || _a === void 0 ? void 0 : _a.replace(/\?.*/g, '')) === pathname; });
+    return list.findIndex(function (page, i) { var _a; return i >= stateWith && ((_a = page.path) === null || _a === void 0 ? void 0 : _a.replace(/\?.*/g, '')) === pathname; });
 };
 Stacks.prototype.getDelta = function getDelta (pathname) {
     if (this.backDelta >= 1) {
@@ -98,8 +110,10 @@ Stacks.prototype.getDelta = function getDelta (pathname) {
     // NOTE: 此处为了修复浏览器后退多级页面，在大量重复路由状况下可能出现判断错误的情况 （增强判断能力只能考虑在 query 中新增参数来判断，暂时搁置）
     return this.getLastIndex(pathname) || 1;
 };
-Stacks.prototype.getPrevIndex = function getPrevIndex (pathname) {
-    var lastIndex = this.getLastIndex(pathname);
+Stacks.prototype.getPrevIndex = function getPrevIndex (pathname, stateWith) {
+        if ( stateWith === void 0 ) stateWith = 1;
+
+    var lastIndex = this.getLastIndex(pathname, stateWith);
     if (lastIndex < 0) {
         return -1;
     }
@@ -125,21 +139,29 @@ var RoutesAlias = function RoutesAlias() {
     var this$1 = this;
 
     this.conf = [];
-    this.getConfig = function (url) {
+    this.getConfig = function (url) {
+        if ( url === void 0 ) url = '';
+
         var customRoute = this$1.conf.filter(function (arr) {
             return arr.includes(url);
         });
         return customRoute[0];
     };
-    this.getOrigin = function (url) {
+    this.getOrigin = function (url) {
+        if ( url === void 0 ) url = '';
+
         var _a;
         return ((_a = this$1.getConfig(url)) === null || _a === void 0 ? void 0 : _a[0]) || url;
     };
-    this.getAlias = function (url) {
+    this.getAlias = function (url) {
+        if ( url === void 0 ) url = '';
+
         var _a;
         return ((_a = this$1.getConfig(url)) === null || _a === void 0 ? void 0 : _a[1]) || url;
     };
-    this.getAll = function (url) {
+    this.getAll = function (url) {
+        if ( url === void 0 ) url = '';
+
         return this$1.conf.filter(function (arr) {
             return arr.includes(url);
         }).reduce(function (p, a) {
@@ -166,27 +188,7 @@ RoutesAlias.prototype.set = function set (customRoutes) {
 
         for (var key in customRoutes) loop( key );
 };
-var routesAlias = new RoutesAlias();
-var isTabBar = function (config) {
-    var _a, _b;
-    var ref = config.router;
-    var customRoutes = ref.customRoutes; if ( customRoutes === void 0 ) customRoutes = {};
-    var basename = ref.basename; if ( basename === void 0 ) basename = '';
-    var pathname = ref.pathname;
-    var routePath = stripBasename(pathname, basename);
-    var pagePath = ((_a = Object.entries(customRoutes).find(function (ref) {
-        var target = ref[1];
-
-        if (typeof target === 'string') {
-            return target === routePath;
-        }
-        else if ((target === null || target === void 0 ? void 0 : target.length) > 0) {
-            return target.includes(routePath);
-        }
-        return false;
-    })) === null || _a === void 0 ? void 0 : _a[0]) || routePath;
-    return !!pagePath && (((_b = config.tabBar) === null || _b === void 0 ? void 0 : _b.list) || []).some(function (t) { return t.pagePath === pagePath; });
-};
+var routesAlias = new RoutesAlias();
 
 function processNavigateUrl(option) {
     var _a;
@@ -920,108 +922,6 @@ var UniversalRouter = function () {
 
 UniversalRouter.pathToRegexp = pathToRegexp_1;
 
-// @ts-nocheck
-function initTabbar(config) {
-    if (config.tabBar == null) {
-        return;
-    }
-    // TODO: 找到 tabbar 的类型
-    var tabbar = document.createElement('taro-tabbar');
-    var homePage = config.entryPagePath || (config.pages ? config.pages[0] : '');
-    tabbar.conf = config.tabBar;
-    tabbar.conf.homePage = exports.history.location.pathname === '/' ? homePage : exports.history.location.pathname;
-    var routerConfig = config.router;
-    tabbar.conf.mode = routerConfig && routerConfig.mode ? routerConfig.mode : 'hash';
-    if (routerConfig.customRoutes) {
-        tabbar.conf.custom = true;
-        tabbar.conf.customRoutes = routerConfig.customRoutes;
-    }
-    else {
-        tabbar.conf.custom = false;
-        tabbar.conf.customRoutes = {};
-    }
-    if (typeof routerConfig.basename !== 'undefined') {
-        tabbar.conf.basename = routerConfig.basename;
-    }
-    var container = document.getElementById('container');
-    // eslint-disable-next-line no-unused-expressions
-    container === null || container === void 0 ? void 0 : container.appendChild(tabbar);
-    taro.initTabBarApis(config);
-}
-
-var routerConfig = Object.create(null);
-function init(config) {
-    var _a;
-    config.router.mode = config.router.mode || 'hash';
-    setHistoryMode(config.router.mode, config.router.basename);
-    Object.assign(routerConfig, config);
-    (_a = document.getElementById('app')) === null || _a === void 0 ? void 0 : _a.remove();
-    var container = document.createElement('div');
-    container.classList.add('taro-tabbar__container');
-    container.id = 'container';
-    var panel = document.createElement('div');
-    panel.classList.add('taro-tabbar__panel');
-    var app = document.createElement('div');
-    app.id = 'app';
-    app.classList.add('taro_router');
-    panel.appendChild(app);
-    container.appendChild(panel);
-    document.body.appendChild(container);
-    initTabbar(config);
-}
-
-var pageScrollFn;
-var pageDOM = window;
-function bindPageScroll(page, config) {
-    pageDOM.removeEventListener('scroll', pageScrollFn);
-    pageDOM = getScrollContainer();
-    var distance = config.onReachBottomDistance || 50;
-    var isReachBottom = false;
-    pageScrollFn = function () {
-        page.onPageScroll && page.onPageScroll({
-            scrollTop: pageDOM instanceof Window ? window.scrollY : pageDOM.scrollTop
-        });
-        if (isReachBottom && getOffset() > distance) {
-            isReachBottom = false;
-        }
-        if (page.onReachBottom &&
-            !isReachBottom &&
-            getOffset() < distance) {
-            isReachBottom = true;
-            page.onReachBottom();
-        }
-    };
-    pageDOM.addEventListener('scroll', pageScrollFn, false);
-}
-window.addEventListener('DOMSubtreeModified', function (e) {
-    var _a;
-    // @ts-ignore
-    var className = (_a = e.target) === null || _a === void 0 ? void 0 : _a.className;
-    if (className && /taro-tabbar__/.test(className)) {
-        pageDOM.removeEventListener('scroll', pageScrollFn);
-        pageDOM = getScrollContainer();
-        pageDOM.addEventListener('scroll', pageScrollFn, false);
-    }
-}, false);
-function getScrollContainer() {
-    if (document.querySelector('.taro-tabbar__tabbar') === null) {
-        // 没设置tabbar
-        return window;
-    }
-    else {
-        // 有设置tabbar
-        return document.querySelector('.taro-tabbar__panel') || window;
-    }
-}
-function getOffset() {
-    if (pageDOM instanceof Window) {
-        return document.documentElement.scrollHeight - window.scrollY - window.innerHeight;
-    }
-    else {
-        return pageDOM.scrollHeight - pageDOM.scrollTop - pageDOM.clientHeight;
-    }
-}
-
 function createCommonjsModule(fn, module) {
 	return module = { exports: {} }, fn(module, module.exports), module.exports;
 }
@@ -1578,9 +1478,171 @@ var queryString_5 = queryString.stringifyUrl;
 var queryString_6 = queryString.pick;
 var queryString_7 = queryString.exclude;
 
-function getSearch() {
+var pageScrollFn;
+var pageDOM = window;
+function bindPageScroll(page, config) {
+    pageDOM.removeEventListener('scroll', pageScrollFn);
+    pageDOM = getScrollContainer();
+    var distance = config.onReachBottomDistance || 50;
+    var isReachBottom = false;
+    pageScrollFn = function () {
+        page.onPageScroll && page.onPageScroll({
+            scrollTop: pageDOM instanceof Window ? window.scrollY : pageDOM.scrollTop
+        });
+        if (isReachBottom && getOffset() > distance) {
+            isReachBottom = false;
+        }
+        if (page.onReachBottom &&
+            !isReachBottom &&
+            getOffset() < distance) {
+            isReachBottom = true;
+            page.onReachBottom();
+        }
+    };
+    pageDOM.addEventListener('scroll', pageScrollFn, false);
+}
+window.addEventListener('DOMSubtreeModified', function (e) {
+    var target = e.target;
+    var className = target === null || target === void 0 ? void 0 : target.className;
+    if (className && /taro_page/.test(className)) {
+        pageDOM.removeEventListener('scroll', pageScrollFn);
+        pageDOM = getScrollContainer();
+        pageDOM.addEventListener('scroll', pageScrollFn, false);
+    }
+}, false);
+function getScrollContainer() {
+    var _a;
+    var id = (_a = runtime.Current.page) === null || _a === void 0 ? void 0 : _a.path;
+    var el = (id
+        ? document.getElementById(id)
+        : document.querySelector('.taro_page') ||
+            document.querySelector('.taro_router'));
+    return el || window;
+}
+function getOffset() {
+    if (pageDOM instanceof Window) {
+        return document.documentElement.scrollHeight - window.scrollY - window.innerHeight;
+    }
+    else {
+        return pageDOM.scrollHeight - pageDOM.scrollTop - pageDOM.clientHeight;
+    }
+}
+
+/**
+ * 插入页面动画需要的样式
+ */
+function loadAnimateStyle(ms) {
+    if ( ms === void 0 ) ms = 300;
+
+    var css = "\n.taro_router .taro_page {\n  position: absolute;\n  left: 0;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  transform: translate3d(100%, 0, 0);\n  transition: transform " + ms + "ms;\n}\n\n.taro_router .taro_page.taro_tabbar_page {\n  transform: none;\n}\n\n.taro_router .taro_page.taro_page_show {\n  transform: translate3d(0, 0, 0);\n}";
+    var style = document.createElement('style');
+    style.innerHTML = css;
+    document.getElementsByTagName('head')[0].appendChild(style);
+}
+
+// @ts-nocheck
+function initTabbar(config) {
+    if (config.tabBar == null) {
+        return;
+    }
+    // TODO: custom-tab-bar
+    var tabbar = document.createElement('taro-tabbar');
+    var homePage = config.entryPagePath || (config.pages ? config.pages[0] : '');
+    tabbar.conf = config.tabBar;
+    tabbar.conf.homePage = exports.history.location.pathname === '/' ? homePage : exports.history.location.pathname;
+    var routerConfig = config.router;
+    tabbar.conf.mode = routerConfig && routerConfig.mode ? routerConfig.mode : 'hash';
+    if (routerConfig.customRoutes) {
+        tabbar.conf.custom = true;
+        tabbar.conf.customRoutes = routerConfig.customRoutes;
+    }
+    else {
+        tabbar.conf.custom = false;
+        tabbar.conf.customRoutes = {};
+    }
+    if (typeof routerConfig.basename !== 'undefined') {
+        tabbar.conf.basename = routerConfig.basename;
+    }
+    var container = document.getElementById('container');
+    container === null || container === void 0 ? void 0 : container.appendChild(tabbar);
+    taro.initTabBarApis(config);
+}
+
+function setDisplay(el, type) {
+    if ( type === void 0 ) type = '';
+
+    if (el) {
+        el.style.display = type;
+    }
+}
+var PageHandler = function PageHandler(config) {
+    this.defaultAnimation = { duration: 300, delay: 50 };
+    this.config = config;
+    this.mount();
+};
+
+var prototypeAccessors$1 = { appId: { configurable: true },router: { configurable: true },routerMode: { configurable: true },customRoutes: { configurable: true },routes: { configurable: true },tabBarList: { configurable: true },PullDownRefresh: { configurable: true },animation: { configurable: true },animationDelay: { configurable: true },animationDuration: { configurable: true },pathname: { configurable: true },basename: { configurable: true },pageConfig: { configurable: true },isTabBar: { configurable: true },search: { configurable: true } };
+prototypeAccessors$1.appId.get = function () { return 'app'; };
+prototypeAccessors$1.router.get = function () { return this.config.router; };
+prototypeAccessors$1.routerMode.get = function () { return this.router.mode || 'hash'; };
+prototypeAccessors$1.customRoutes.get = function () { return this.router.customRoutes || {}; };
+prototypeAccessors$1.routes.get = function () { return this.config.routes; };
+prototypeAccessors$1.tabBarList.get = function () { var _a; return ((_a = this.config.tabBar) === null || _a === void 0 ? void 0 : _a.list) || []; };
+prototypeAccessors$1.PullDownRefresh.get = function () { return this.config.PullDownRefresh; };
+prototypeAccessors$1.animation.get = function () { var _a, _b; return (_b = (_a = this.config) === null || _a === void 0 ? void 0 : _a.animation) !== null && _b !== void 0 ? _b : this.defaultAnimation; };
+prototypeAccessors$1.animationDelay.get = function () {
+    var _a;
+    return typeof this.animation === 'object'
+        ? this.animation.delay
+        : this.animation
+            ? (_a = this.defaultAnimation) === null || _a === void 0 ? void 0 : _a.delay
+            : 0;
+};
+prototypeAccessors$1.animationDuration.get = function () {
+    var _a;
+    return typeof this.animation === 'object'
+        ? this.animation.duration
+        : this.animation
+            ? (_a = this.defaultAnimation) === null || _a === void 0 ? void 0 : _a.duration
+            : 0;
+};
+prototypeAccessors$1.pathname.set = function (p) { this.router.pathname = p; };
+prototypeAccessors$1.pathname.get = function () { return this.router.pathname; };
+prototypeAccessors$1.basename.get = function () { return this.router.basename || ''; };
+prototypeAccessors$1.pageConfig.get = function () {
+        var this$1 = this;
+
+    return this.routes.find(function (r) {
+        var _a;
+        var routePath = stripBasename(this$1.pathname, this$1.basename);
+        var pagePath = addLeadingSlash(r.path);
+        return pagePath === routePath || ((_a = routesAlias.getConfig(pagePath)) === null || _a === void 0 ? void 0 : _a.includes(routePath));
+    });
+};
+prototypeAccessors$1.isTabBar.get = function () {
+    var _a;
+    var routePath = stripBasename(this.pathname, this.basename);
+    var pagePath = ((_a = Object.entries(this.customRoutes).find(function (ref) {
+            var target = ref[1];
+
+        if (typeof target === 'string') {
+            return target === routePath;
+        }
+        else if ((target === null || target === void 0 ? void 0 : target.length) > 0) {
+            return target.includes(routePath);
+        }
+        return false;
+    })) === null || _a === void 0 ? void 0 : _a[0]) || routePath;
+    return !!pagePath && this.tabBarList.some(function (t) { return t.pagePath === pagePath; });
+};
+PageHandler.prototype.isSamePage = function isSamePage (page) {
+    var routePath = stripBasename(this.pathname, this.basename);
+    var pagePath = stripBasename(page === null || page === void 0 ? void 0 : page.path, this.basename);
+    return pagePath.startsWith(routePath + '?');
+};
+prototypeAccessors$1.search.get = function () {
     var search = '?';
-    if (routerConfig.router.mode === 'hash') {
+    if (this.routerMode) {
         var idx = location.hash.indexOf('?');
         if (idx > -1) {
             search = location.hash.slice(idx);
@@ -1590,11 +1652,11 @@ function getSearch() {
         search = location.search;
     }
     return search.substr(1);
-}
-var qs = function (stamp) {
-    if ( stamp === void 0 ) stamp = 0;
+};
+PageHandler.prototype.getQuery = function getQuery (stamp) {
+        if ( stamp === void 0 ) stamp = 0;
 
-    var search = getSearch();
+    var search = this.search;
     var query = search
         ? queryString.parse(search)
         : {};
@@ -1602,11 +1664,32 @@ var qs = function (stamp) {
         query.stamp = stamp.toString();
     }
     return query;
-};
-
-/* eslint-disable dot-notation */
-function pageOnReady(page, onLoad) {
-    if ( onLoad === void 0 ) onLoad = true;
+};
+PageHandler.prototype.mount = function mount () {
+    var _a;
+    setHistoryMode(this.routerMode, this.router.basename);
+    (_a = document.getElementById('app')) === null || _a === void 0 ? void 0 : _a.remove();
+    this.animation && loadAnimateStyle(this.animationDuration);
+    var app = document.createElement('div');
+    app.id = this.appId;
+    app.classList.add('taro_router');
+    if (this.tabBarList.length > 1) {
+        var container = document.createElement('div');
+        container.classList.add('taro-tabbar__container');
+        container.id = 'container';
+        var panel = document.createElement('div');
+        panel.classList.add('taro-tabbar__panel');
+        panel.appendChild(app);
+        container.appendChild(panel);
+        document.body.appendChild(container);
+        initTabbar(this.config);
+    }
+    else {
+        document.body.appendChild(app);
+    }
+};
+PageHandler.prototype.onReady = function onReady (page, onLoad) {
+        if ( onLoad === void 0 ) onLoad = true;
 
     var _a, _b;
     var pageEl = document.getElementById(page.path);
@@ -1620,81 +1703,135 @@ function pageOnReady(page, onLoad) {
         });
         onLoad && (pageEl['__page'] = page);
     }
-}
-function loadPage(page, pageConfig, stacksIndex) {
-    if ( pageConfig === void 0 ) pageConfig = {};
-    if ( stacksIndex === void 0 ) stacksIndex = 0;
+};
+PageHandler.prototype.load = function load (page, pageConfig, stacksIndex) {
+        var this$1 = this;
+        if ( pageConfig === void 0 ) pageConfig = {};
+        if ( stacksIndex === void 0 ) stacksIndex = 0;
 
     if (!page)
         { return; }
     var pageEl = document.getElementById(page.path);
     if (pageEl) {
-        pageEl.style.display = 'block';
+        setDisplay(pageEl);
+        this.isTabBar && pageEl.classList.add('taro_tabbar_page');
+        this.addAnimation(pageEl, stacksIndex === 0);
     }
     else {
-        page.onLoad(qs(stacksIndex), function () { return pageOnReady(page, true); });
+        page.onLoad(this.getQuery(stacksIndex), function () {
+            pageEl = document.getElementById(page.path);
+            this$1.isTabBar && (pageEl === null || pageEl === void 0 ? void 0 : pageEl.classList.add('taro_tabbar_page'));
+            this$1.addAnimation(pageEl, stacksIndex === 0);
+            this$1.onReady(page, true);
+        });
     }
     stacks.push(page);
     page.onShow();
     bindPageScroll(page, pageConfig);
-}
-function unloadPage(page, delta) {
-    if ( delta === void 0 ) delta = 1;
+};
+PageHandler.prototype.unload = function unload (page, delta, top) {
+        var this$1 = this;
+        if ( delta === void 0 ) delta = 1;
+        if ( top === void 0 ) top = false;
 
+    var _a;
     if (!page)
         { return; }
     stacks.delta = --delta;
     stacks.pop();
-    page.onUnload();
+    if (this.animation && top) {
+        if (this.unloadTimer) {
+            clearTimeout(this.unloadTimer);
+            (_a = this.lastUnloadPage) === null || _a === void 0 ? void 0 : _a.onUnload();
+            this.unloadTimer = null;
+        }
+        this.lastUnloadPage = page;
+        var pageEl = document.getElementById(page.path);
+        pageEl === null || pageEl === void 0 ? void 0 : pageEl.classList.remove('taro_page_show');
+        this.unloadTimer = setTimeout(function () {
+            var _a;
+            this$1.unloadTimer = null;
+            (_a = this$1.lastUnloadPage) === null || _a === void 0 ? void 0 : _a.onUnload();
+        }, this.animationDuration);
+    }
     if (delta >= 1)
-        { unloadPage(stacks.last, delta); }
-}
-function showPage(page, pageConfig, stacksIndex) {
-    if ( pageConfig === void 0 ) pageConfig = {};
-    if ( stacksIndex === void 0 ) stacksIndex = 0;
+        { this.unload(stacks.last, delta); }
+};
+PageHandler.prototype.show = function show (page, pageConfig, stacksIndex) {
+        var this$1 = this;
+        if ( pageConfig === void 0 ) pageConfig = {};
+        if ( stacksIndex === void 0 ) stacksIndex = 0;
 
     if (!page)
         { return; }
     page.onShow();
     var pageEl = document.getElementById(page.path);
     if (pageEl) {
-        pageEl.style.display = 'block';
+        setDisplay(pageEl);
+        this.addAnimation(pageEl, stacksIndex === 0);
     }
     else {
-        page.onLoad(qs(stacksIndex), function () { return pageOnReady(page, false); });
+        page.onLoad(this.getQuery(stacksIndex), function () {
+            pageEl = document.getElementById(page.path);
+            this$1.addAnimation(pageEl, stacksIndex === 0);
+            this$1.onReady(page, false);
+        });
     }
     bindPageScroll(page, pageConfig);
-}
-function hidePage(page) {
+};
+PageHandler.prototype.hide = function hide (page) {
+        var this$1 = this;
+
     if (!page)
         { return; }
     // NOTE: 修复多页并发问题，此处可能因为路由跳转过快，执行时页面可能还没有创建成功
     var pageEl = document.getElementById(page.path);
     if (pageEl) {
-        pageEl.style.display = 'none';
+        if (this.hideTimer) {
+            clearTimeout(this.hideTimer);
+            this.hideTimer = null;
+            setDisplay(this.lastHidePage, 'none');
+        }
+        this.lastHidePage = pageEl;
+        this.hideTimer = setTimeout(function () {
+            this$1.hideTimer = null;
+            setDisplay(this$1.lastHidePage, 'none');
+        }, this.animationDelay);
         page.onHide();
     }
     else {
-        setTimeout(function () { return hidePage(page); }, 0);
+        setTimeout(function () { return this$1.hide(page); }, 0);
     }
-}
+};
+PageHandler.prototype.addAnimation = function addAnimation (pageEl, first) {
+        if ( first === void 0 ) first = false;
+
+    if (!pageEl)
+        { return; }
+    if (this.animation && !first) {
+        setTimeout(function () {
+            pageEl.classList.add('taro_page_show');
+        }, this.animationDelay);
+    }
+    else {
+        pageEl.classList.add('taro_page_show');
+    }
+};
+
+Object.defineProperties( PageHandler.prototype, prototypeAccessors$1 );
 
 /* eslint-disable dot-notation */
 function createRouter(app, config, framework) {
     var _a;
-    init(config);
-    var routes = [];
+    var handler = new PageHandler(config);
     var runtimeHooks = runtime.container.get(runtime.SERVICE_IDENTIFIER.Hooks);
-    routesAlias.set(config.router.customRoutes);
-    for (var i = 0; i < config.routes.length; i++) {
-        var route = config.routes[i];
-        var path = addLeadingSlash(route.path);
-        routes.push({
-            path: routesAlias.getAll(path),
-            action: route.load
-        });
-    }
-    var basename = config.router.basename;
+    routesAlias.set(handler.router.customRoutes);
+    var basename = handler.router.basename;
+    var routes = handler.routes.map(function (route) { return ({
+        path: routesAlias.getAll(addLeadingSlash(route.path)),
+        action: route.load
+    }); });
+    var entryPagePath = config.entryPagePath || ((_a = routes[0].path) === null || _a === void 0 ? void 0 : _a[0]);
     var router = new UniversalRouter(routes, { baseUrl: basename || '' });
     app.onLaunch();
     var render = async function (ref) {
@@ -1702,15 +1839,15 @@ function createRouter(app, config, framework) {
         var action = ref.action;
 
         var _a, _b, _c, _d;
-        routerConfig.router.pathname = location.pathname;
+        handler.pathname = location.pathname;
         var element;
         try {
-            element = await router.resolve(config.router.forcePath || location.pathname);
+            element = await router.resolve(handler.router.forcePath || handler.pathname);
         }
         catch (error) {
             if (error.status === 404) {
                 (_a = app.onPageNotFound) === null || _a === void 0 ? void 0 : _a.call(app, {
-                    path: location.pathname
+                    path: handler.pathname
                 });
             }
             else {
@@ -1719,16 +1856,11 @@ function createRouter(app, config, framework) {
         }
         if (!element)
             { return; }
-        var pageConfig = config.routes.find(function (r) {
-            var _a;
-            var path = addLeadingSlash(r.path);
-            var urlPath = stripBasename(location.pathname, routerConfig.router.basename);
-            return path === urlPath || ((_a = routesAlias.getConfig(path)) === null || _a === void 0 ? void 0 : _a.includes(urlPath));
-        });
+        var pageConfig = handler.pageConfig;
         var enablePullDownRefresh = false;
         runtime.eventCenter.trigger('__taroRouterChange', {
             toLocation: {
-                path: location.pathname
+                path: handler.pathname
             }
         });
         if (pageConfig) {
@@ -1736,37 +1868,38 @@ function createRouter(app, config, framework) {
             enablePullDownRefresh = pageConfig.enablePullDownRefresh;
         }
         var currentPage = runtime.Current.page;
-        var pathname = location.pathname;
+        var pathname = handler.pathname;
         var shouldLoad = false;
         if (action === 'POP') {
             // NOTE: 浏览器事件退后多次时，该事件只会被触发一次
             var prevIndex = stacks.getPrevIndex(pathname);
             var delta = stacks.getDelta(pathname);
-            unloadPage(currentPage, delta);
+            handler.unload(currentPage, delta, prevIndex > -1);
             if (prevIndex > -1) {
-                showPage(stacks.getItem(prevIndex), pageConfig, prevIndex);
+                handler.show(stacks.getItem(prevIndex), pageConfig, prevIndex);
             }
             else {
                 shouldLoad = true;
             }
         }
-        else if (action === 'PUSH') {
-            hidePage(currentPage);
-            shouldLoad = true;
-        }
-        else if (action === 'REPLACE') {
-            if (isTabBar(config)) {
-                hidePage(currentPage);
-                var prevIndex$1 = stacks.getPrevIndex(pathname);
+        else {
+            if (handler.isTabBar) {
+                if (handler.isSamePage(currentPage))
+                    { return; }
+                var prevIndex$1 = stacks.getPrevIndex(pathname, 0);
+                handler.hide(currentPage);
                 if (prevIndex$1 > -1) {
                     // NOTE: tabbar 页且之前出现过，直接复用
-                    return showPage(stacks.getItem(prevIndex$1), pageConfig, prevIndex$1);
+                    return handler.show(stacks.getItem(prevIndex$1), pageConfig, prevIndex$1);
                 }
             }
-            else {
+            else if (action === 'REPLACE') {
                 var delta$1 = stacks.getDelta(pathname);
                 // NOTE: 页面路由记录并不会清空，只是移除掉缓存的 stack 以及页面
-                unloadPage(currentPage, delta$1);
+                handler.unload(currentPage, delta$1);
+            }
+            else if (action === 'PUSH') {
+                handler.hide(currentPage);
             }
             shouldLoad = true;
         }
@@ -1776,15 +1909,15 @@ function createRouter(app, config, framework) {
             var stacksIndex = stacks.length;
             delete loadConfig['path'];
             delete loadConfig['load'];
-            var page = runtime.createPageConfig(enablePullDownRefresh ? (_d = runtimeHooks.createPullDownComponent) === null || _d === void 0 ? void 0 : _d.call(runtimeHooks, el, location.pathname, framework, routerConfig.PullDownRefresh) : el, pathname + runtime.stringify(qs(stacksIndex)), {}, loadConfig);
-            return loadPage(page, pageConfig, stacksIndex);
+            var page = runtime.createPageConfig(enablePullDownRefresh ? (_d = runtimeHooks.createPullDownComponent) === null || _d === void 0 ? void 0 : _d.call(runtimeHooks, el, location.pathname, framework, handler.PullDownRefresh) : el, pathname + runtime.stringify(handler.getQuery(stacksIndex)), {}, loadConfig);
+            return handler.load(page, pageConfig, stacksIndex);
         }
     };
     if (exports.history.location.pathname === '/') {
-        exports.history.replace(prependBasename((config.entryPagePath || ((_a = routes[0].path) === null || _a === void 0 ? void 0 : _a[0])) + exports.history.location.search));
+        exports.history.replace(prependBasename(entryPagePath + exports.history.location.search));
     }
     render({ location: exports.history.location, action: r.Push });
-    app.onShow(qs(stacks.length));
+    app.onShow(handler.getQuery(stacks.length));
     return exports.history.listen(render);
 }