@tarojs/router 3.4.0-beta.3 → 3.5.0-canary.1

package/dist/router.esm.js

@@ -6,7 +6,7 @@ import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
 import _classCallCheck from '@babel/runtime/helpers/classCallCheck';
 import _createClass from '@babel/runtime/helpers/createClass';
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import { Current, requestAnimationFrame, container, SERVICE_IDENTIFIER, createPageConfig, stringify, eventCenter } from '@tarojs/runtime';
+import { requestAnimationFrame, Current, container, SERVICE_IDENTIFIER, createPageConfig, stringify, eventCenter } from '@tarojs/runtime';
 import _typeof from '@babel/runtime/helpers/typeof';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import _createForOfIteratorHelper from '@babel/runtime/helpers/createForOfIteratorHelper';
@@ -588,8 +588,8 @@ var RoutesAlias = /*#__PURE__*/function () {
       var url = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
       return _this.conf.filter(function (arr) {
         return arr.includes(url);
-      }).reduce(function (p, a) {
-        p.push(a[1]);
+      }).reduceRight(function (p, a) {
+        p.unshift(a[1]);
         return p;
       }, [url]);
     });
@@ -633,12 +633,10 @@ var routesAlias = new RoutesAlias();
 function processNavigateUrl(option) {
   var _pathPieces$pathname;
 
-  var pathPieces = J(option.url); // 处理自定义路由
+  var pathPieces = J(option.url); // 处理相对路径
 
-  pathPieces.pathname = routesAlias.getAlias(addLeadingSlash(pathPieces.pathname)); // 处理相对路径
-
-  if (pathPieces !== null && pathPieces !== void 0 && (_pathPieces$pathname = pathPieces.pathname) !== null && _pathPieces$pathname !== void 0 && _pathPieces$pathname.includes('./')) {
-    var parts = history.location.pathname.split('/');
+  if ((_pathPieces$pathname = pathPieces.pathname) !== null && _pathPieces$pathname !== void 0 && _pathPieces$pathname.includes('./')) {
+    var parts = routesAlias.getOrigin(history.location.pathname).split('/');
     parts.pop();
     pathPieces.pathname.split('/').forEach(function (item) {
       if (item === '.') {
@@ -648,8 +646,10 @@ function processNavigateUrl(option) {
       item === '..' ? parts.pop() : parts.push(item);
     });
     pathPieces.pathname = parts.join('/');
-  } // 处理 basename
+  } // 处理自定义路由
+
 
+  pathPieces.pathname = routesAlias.getAlias(addLeadingSlash(pathPieces.pathname)); // 处理 basename
 
   pathPieces.pathname = prependBasename(pathPieces.pathname); // hack fix history v5 bug: https://github.com/remix-run/history/issues/814
 
@@ -673,7 +673,7 @@ function _navigate() {
                   fail = option.fail;
               var unListen = history.listen(function () {
                 var res = {
-                  errMsg: "".concat(method, ": ok")
+                  errMsg: "".concat(method, ":ok")
                 };
                 success === null || success === void 0 ? void 0 : success(res);
                 complete === null || complete === void 0 ? void 0 : complete(res);
@@ -702,7 +702,7 @@ function _navigate() {
                 }
               } catch (error) {
                 var res = {
-                  errMsg: "".concat(method, ": fail ").concat(error.message || error)
+                  errMsg: "".concat(method, ":fail ").concat(error.message || error)
                 };
                 fail === null || fail === void 0 ? void 0 : fail(res);
                 complete === null || complete === void 0 ? void 0 : complete(res);
@@ -1946,81 +1946,12 @@ var filterObj = function filterObj(obj, predicate) {
   };
 })(queryString);
 
-var pageScrollFn;
-var pageDOM = window;
-function bindPageScroll(page, pageEl, config) {
-  pageEl.removeEventListener('scroll', pageScrollFn);
-  pageDOM = pageEl;
-  var distance = config.onReachBottomDistance || 50;
-  var isReachBottom = false;
-
-  pageScrollFn = function pageScrollFn() {
-    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);
-}
-
-function getOffset() {
-  if (pageDOM instanceof Window) {
-    return document.documentElement.scrollHeight - window.scrollY - window.innerHeight;
-  } else {
-    return pageDOM.scrollHeight - pageDOM.scrollTop - pageDOM.clientHeight;
-  }
-}
-
-var pageResizeFn;
-function bindPageResize(page) {
-  window.removeEventListener('resize', pageResizeFn);
-
-  pageResizeFn = function pageResizeFn() {
-    page.onResize && page.onResize({
-      size: {
-        windowHeight: window.innerHeight,
-        windowWidth: window.innerWidth
-      }
-    });
-  };
-
-  window.addEventListener('resize', pageResizeFn, false);
-}
-
-function bindPageEvents(page, pageEl) {
-  var config = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
-
-  if (!pageEl) {
-    pageEl = getPageContainer();
-  }
-
-  bindPageScroll(page, pageEl, config);
-  bindPageResize(page);
-}
-
-function getPageContainer() {
-  var _Current$page;
-
-  var id = (_Current$page = Current.page) === null || _Current$page === void 0 ? void 0 : _Current$page.path;
-  var el = id ? document.getElementById(id) : document.querySelector('.taro_page') || document.querySelector('.taro_router');
-  return el || window;
-}
-
 /**
  * 插入页面动画需要的样式
  */
 function loadAnimateStyle() {
   var ms = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 300;
-  var css = "\n.taro_router .taro_page {\n  position: absolute;\n  left: 0;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  background-color: #fff;\n  transform: translate3d(100%, 0, 0);\n  transition: transform ".concat(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 css = "\n.taro_router .taro_page {\n  position: absolute;\n  left: 0;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  background-color: #fff;\n  transform: translate(100%, 0);\n  transition: transform ".concat(ms, "ms;\n  z-index: 0;\n}\n\n.taro_router .taro_page.taro_tabbar_page,\n.taro_router .taro_page.taro_page_show.taro_page_stationed {\n  transform: none;\n}\n\n.taro_router .taro_page.taro_page_show {\n  transform: translate(0, 0);\n}");
   var style = document.createElement('style');
   style.innerHTML = css;
   document.getElementsByTagName('head')[0].appendChild(style);
@@ -2057,6 +1988,56 @@ function initTabbar(config) {
   initTabBarApis(config);
 }
 
+var pageResizeFn;
+function bindPageResize(page) {
+  window.removeEventListener('resize', pageResizeFn);
+
+  pageResizeFn = function pageResizeFn() {
+    page.onResize && page.onResize({
+      size: {
+        windowHeight: window.innerHeight,
+        windowWidth: window.innerWidth
+      }
+    });
+  };
+
+  window.addEventListener('resize', pageResizeFn, false);
+}
+
+var pageScrollFn;
+var pageDOM = window;
+function bindPageScroll(page, pageEl) {
+  var distance = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 50;
+  pageEl.removeEventListener('scroll', pageScrollFn);
+  pageDOM = pageEl;
+  var isReachBottom = false;
+
+  pageScrollFn = function pageScrollFn() {
+    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);
+}
+
+function getOffset() {
+  if (pageDOM instanceof Window) {
+    return document.documentElement.scrollHeight - window.scrollY - window.innerHeight;
+  } else {
+    return pageDOM.scrollHeight - pageDOM.scrollTop - pageDOM.clientHeight;
+  }
+}
+
 function setDisplay(el) {
   var type = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
 
@@ -2259,7 +2240,7 @@ var PageHandler = /*#__PURE__*/function () {
     key: "onReady",
     value: function onReady(page) {
       var onLoad = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
-      var pageEl = document.getElementById(page.path);
+      var pageEl = this.getPageContainer(page);
 
       if (pageEl && !(pageEl !== null && pageEl !== void 0 && pageEl['__isReady'])) {
         var _el$componentOnReady, _el$componentOnReady$;
@@ -2287,7 +2268,7 @@ var PageHandler = /*#__PURE__*/function () {
 
       stacks.push(page);
       var param = this.getQuery(stacks.length, '', page.options);
-      var pageEl = document.getElementById(page.path);
+      var pageEl = this.getPageContainer(page);
 
       if (pageEl) {
         var _page$onShow;
@@ -2296,14 +2277,14 @@ var PageHandler = /*#__PURE__*/function () {
         this.isTabBar && pageEl.classList.add('taro_tabbar_page');
         this.addAnimation(pageEl, stacksIndex === 0);
         (_page$onShow = page.onShow) === null || _page$onShow === void 0 ? void 0 : _page$onShow.call(page);
-        bindPageEvents(page, pageEl, pageConfig);
+        this.bindPageEvents(page, pageEl, pageConfig);
       } else {
         var _page$onLoad;
 
         (_page$onLoad = page.onLoad) === null || _page$onLoad === void 0 ? void 0 : _page$onLoad.call(page, param, function () {
           var _pageEl, _page$onShow2;
 
-          pageEl = document.getElementById(page.path);
+          pageEl = _this2.getPageContainer(page);
           _this2.isTabBar && ((_pageEl = pageEl) === null || _pageEl === void 0 ? void 0 : _pageEl.classList.add('taro_tabbar_page'));
 
           _this2.addAnimation(pageEl, stacksIndex === 0);
@@ -2311,7 +2292,8 @@ var PageHandler = /*#__PURE__*/function () {
           _this2.onReady(page, true);
 
           (_page$onShow2 = page.onShow) === null || _page$onShow2 === void 0 ? void 0 : _page$onShow2.call(page);
-          bindPageEvents(page, pageEl, pageConfig);
+
+          _this2.bindPageEvents(page, pageEl, pageConfig);
         });
       }
     }
@@ -2336,7 +2318,8 @@ var PageHandler = /*#__PURE__*/function () {
         }
 
         this.lastUnloadPage = page;
-        var pageEl = document.getElementById(page.path);
+        var pageEl = this.getPageContainer(page);
+        pageEl === null || pageEl === void 0 ? void 0 : pageEl.classList.remove('taro_page_stationed');
         pageEl === null || pageEl === void 0 ? void 0 : pageEl.classList.remove('taro_page_show');
         this.unloadTimer = setTimeout(function () {
           var _this3$lastUnloadPage, _this3$lastUnloadPage2;
@@ -2347,8 +2330,9 @@ var PageHandler = /*#__PURE__*/function () {
       } else {
         var _page$onUnload;
 
-        var _pageEl2 = document.getElementById(page.path);
+        var _pageEl2 = this.getPageContainer(page);
 
+        _pageEl2 === null || _pageEl2 === void 0 ? void 0 : _pageEl2.classList.remove('taro_page_stationed');
         _pageEl2 === null || _pageEl2 === void 0 ? void 0 : _pageEl2.classList.remove('taro_page_show');
         page === null || page === void 0 ? void 0 : (_page$onUnload = page.onUnload) === null || _page$onUnload === void 0 ? void 0 : _page$onUnload.call(page);
       }
@@ -2364,7 +2348,7 @@ var PageHandler = /*#__PURE__*/function () {
       var stacksIndex = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
       if (!page) return;
       var param = this.getQuery(stacks.length, '', page.options);
-      var pageEl = document.getElementById(page.path);
+      var pageEl = this.getPageContainer(page);
 
       if (pageEl) {
         var _page$onShow3;
@@ -2372,21 +2356,22 @@ var PageHandler = /*#__PURE__*/function () {
         setDisplay(pageEl);
         this.addAnimation(pageEl, stacksIndex === 0);
         (_page$onShow3 = page.onShow) === null || _page$onShow3 === void 0 ? void 0 : _page$onShow3.call(page);
-        bindPageEvents(page, pageEl, pageConfig);
+        this.bindPageEvents(page, pageEl, pageConfig);
       } else {
         var _page$onLoad2;
 
         (_page$onLoad2 = page.onLoad) === null || _page$onLoad2 === void 0 ? void 0 : _page$onLoad2.call(page, param, function () {
           var _page$onShow4;
 
-          pageEl = document.getElementById(page.path);
+          pageEl = _this4.getPageContainer(page);
 
           _this4.addAnimation(pageEl, stacksIndex === 0);
 
           _this4.onReady(page, false);
 
           (_page$onShow4 = page.onShow) === null || _page$onShow4 === void 0 ? void 0 : _page$onShow4.call(page);
-          bindPageEvents(page, pageEl, pageConfig);
+
+          _this4.bindPageEvents(page, pageEl, pageConfig);
         });
       }
     }
@@ -2397,7 +2382,7 @@ var PageHandler = /*#__PURE__*/function () {
 
       if (!page) return; // NOTE: 修复多页并发问题，此处可能因为路由跳转过快，执行时页面可能还没有创建成功
 
-      var pageEl = document.getElementById(page.path);
+      var pageEl = this.getPageContainer(page);
 
       if (pageEl) {
         var _page$onHide;
@@ -2423,17 +2408,53 @@ var PageHandler = /*#__PURE__*/function () {
   }, {
     key: "addAnimation",
     value: function addAnimation(pageEl) {
+      var _this6 = this;
+
       var first = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
       if (!pageEl) return;
 
       if (this.animation && !first) {
         setTimeout(function () {
           pageEl.classList.add('taro_page_show');
+          setTimeout(function () {
+            pageEl.classList.add('taro_page_stationed');
+          }, _this6.animationDuration);
         }, this.animationDelay);
       } else {
         pageEl.classList.add('taro_page_show');
+        pageEl.classList.add('taro_page_stationed');
       }
     }
+  }, {
+    key: "getPageContainer",
+    value: function getPageContainer(page) {
+      var _Current$page;
+
+      var path = page ? page === null || page === void 0 ? void 0 : page.path : (_Current$page = Current.page) === null || _Current$page === void 0 ? void 0 : _Current$page.path;
+      var id = path === null || path === void 0 ? void 0 : path.replace(/([^a-z0-9\u00a0-\uffff_-])/ig, '\\$1');
+
+      if (page) {
+        return document.querySelector(".taro_page#".concat(id));
+      }
+
+      var el = id ? document.querySelector(".taro_page#".concat(id)) : document.querySelector('.taro_page') || document.querySelector('.taro_router');
+      return el || window;
+    }
+  }, {
+    key: "bindPageEvents",
+    value: function bindPageEvents(page, pageEl) {
+      var _this$config$window;
+
+      var config = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+
+      if (!pageEl) {
+        pageEl = this.getPageContainer();
+      }
+
+      var distance = config.onReachBottomDistance || ((_this$config$window = this.config.window) === null || _this$config$window === void 0 ? void 0 : _this$config$window.onReachBottomDistance) || 50;
+      bindPageScroll(page, pageEl, distance);
+      bindPageResize(page);
+    }
   }]);
 
   return PageHandler;
@@ -2461,6 +2482,8 @@ function createRouter(app, config, framework) {
 
   var render = /*#__PURE__*/function () {
     var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(_ref) {
+      var _config$window;
+
       var location, action, element, _app$onPageNotFound, pageConfig, enablePullDownRefresh, _pageConfig$navigatio, currentPage, pathname, shouldLoad, prevIndex, delta, _prevIndex, _delta, _element$default, _runtimeHooks$createP, el, loadConfig, stacksIndex, page;
 
       return _regeneratorRuntime.wrap(function _callee$(_context) {
@@ -2506,7 +2529,7 @@ function createRouter(app, config, framework) {
 
             case 17:
               pageConfig = handler.pageConfig;
-              enablePullDownRefresh = false;
+              enablePullDownRefresh = (config === null || config === void 0 ? void 0 : (_config$window = config.window) === null || _config$window === void 0 ? void 0 : _config$window.enablePullDownRefresh) || false;
               eventCenter.trigger('__taroRouterChange', {
                 toLocation: {
                   path: handler.pathname
@@ -2515,7 +2538,10 @@ function createRouter(app, config, framework) {
 
               if (pageConfig) {
                 document.title = (_pageConfig$navigatio = pageConfig.navigationBarTitleText) !== null && _pageConfig$navigatio !== void 0 ? _pageConfig$navigatio : document.title;
-                enablePullDownRefresh = pageConfig.enablePullDownRefresh;
+
+                if (typeof pageConfig.enablePullDownRefresh === 'boolean') {
+                  enablePullDownRefresh = pageConfig.enablePullDownRefresh;
+                }
               }
 
               currentPage = Current.page;