@tarojs/router 3.5.0-beta.1 → 3.5.0-beta.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/api.js CHANGED
@@ -8,10 +8,10 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
8
8
  });
9
9
  };
10
10
  import { parsePath } from 'history';
11
- import stacks from './router/stack';
12
11
  import { history, prependBasename } from './history';
13
- import { routesAlias, addLeadingSlash } from './utils';
14
12
  import { RouterConfig } from './router';
13
+ import stacks from './router/stack';
14
+ import { addLeadingSlash, routesAlias } from './utils';
15
15
  function processNavigateUrl(option) {
16
16
  var _a;
17
17
  const pathPieces = parsePath(option.url);
package/dist/index.cjs.js CHANGED
@@ -4,14 +4,39 @@ Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var history = require('history');
6
6
  var runtime = require('@tarojs/runtime');
7
- var UniversalRouter = require('universal-router');
8
7
  var queryString = require('query-string');
9
8
  var taro = require('@tarojs/taro');
9
+ var UniversalRouter = require('universal-router');
10
10
 
11
11
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
12
12
 
13
- var UniversalRouter__default = /*#__PURE__*/_interopDefaultLegacy(UniversalRouter);
14
13
  var queryString__default = /*#__PURE__*/_interopDefaultLegacy(queryString);
14
+ var UniversalRouter__default = /*#__PURE__*/_interopDefaultLegacy(UniversalRouter);
15
+
16
+ /******************************************************************************
17
+ Copyright (c) Microsoft Corporation.
18
+
19
+ Permission to use, copy, modify, and/or distribute this software for any
20
+ purpose with or without fee is hereby granted.
21
+
22
+ THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
23
+ REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
24
+ AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
25
+ INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
26
+ LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
27
+ OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
28
+ PERFORMANCE OF THIS SOFTWARE.
29
+ ***************************************************************************** */
30
+
31
+ function __awaiter(thisArg, _arguments, P, generator) {
32
+ function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
33
+ return new (P || (P = Promise))(function (resolve, reject) {
34
+ function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
35
+ function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
36
+ function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
37
+ step((generator = generator.apply(thisArg, _arguments || [])).next());
38
+ });
39
+ }
15
40
 
16
41
  const addLeadingSlash = (url = '') => (url.charAt(0) === '/' ? url : '/' + url);
17
42
  const hasBasename = (path = '', prefix = '') => new RegExp('^' + prefix + '(\\/|\\?|#|$)', 'i').test(path) || path === prefix;
@@ -178,31 +203,6 @@ function prependBasename(url = '') {
178
203
  return basename.replace(/\/$/, '') + '/' + url.replace(/^\//, '');
179
204
  }
180
205
 
181
- /*! *****************************************************************************
182
- Copyright (c) Microsoft Corporation.
183
-
184
- Permission to use, copy, modify, and/or distribute this software for any
185
- purpose with or without fee is hereby granted.
186
-
187
- THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
188
- REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
189
- AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
190
- INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
191
- LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
192
- OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
193
- PERFORMANCE OF THIS SOFTWARE.
194
- ***************************************************************************** */
195
-
196
- function __awaiter(thisArg, _arguments, P, generator) {
197
- function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
198
- return new (P || (P = Promise))(function (resolve, reject) {
199
- function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
200
- function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
201
- function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
202
- step((generator = generator.apply(thisArg, _arguments || [])).next());
203
- });
204
- }
205
-
206
206
  class Stacks {
207
207
  constructor() {
208
208
  this.stacks = [];
@@ -352,36 +352,6 @@ function getCurrentPages() {
352
352
  return pages.map(e => (Object.assign(Object.assign({}, e), { route: e.path || '' })));
353
353
  }
354
354
 
355
- /**
356
- * 插入页面动画需要的样式
357
- */
358
- function loadAnimateStyle(ms = 300) {
359
- const css = `
360
- .taro_router .taro_page {
361
- position: absolute;
362
- left: 0;
363
- top: 0;
364
- width: 100%;
365
- height: 100%;
366
- background-color: #fff;
367
- transform: translate(100%, 0);
368
- transition: transform ${ms}ms;
369
- z-index: 0;
370
- }
371
-
372
- .taro_router .taro_page.taro_tabbar_page,
373
- .taro_router .taro_page.taro_page_show.taro_page_stationed {
374
- transform: none;
375
- }
376
-
377
- .taro_router .taro_page.taro_page_show {
378
- transform: translate(0, 0);
379
- }`;
380
- const style = document.createElement('style');
381
- style.innerHTML = css;
382
- document.getElementsByTagName('head')[0].appendChild(style);
383
- }
384
-
385
355
  let pageResizeFn;
386
356
  function bindPageResize(page) {
387
357
  pageResizeFn && window.removeEventListener('resize', pageResizeFn);
@@ -455,6 +425,189 @@ function initTabbar(config) {
455
425
  taro.initTabBarApis(config);
456
426
  }
457
427
 
428
+ class MultiPageHandler {
429
+ constructor(config) {
430
+ this.config = config;
431
+ this.mount();
432
+ }
433
+ get appId() { return 'app'; }
434
+ get router() { return this.config.router; }
435
+ get routerMode() { return this.router.mode || 'hash'; }
436
+ get customRoutes() { return this.router.customRoutes || {}; }
437
+ get tabBarList() { var _a; return ((_a = this.config.tabBar) === null || _a === void 0 ? void 0 : _a.list) || []; }
438
+ get PullDownRefresh() { return this.config.PullDownRefresh; }
439
+ set pathname(p) { this.router.pathname = p; }
440
+ get pathname() { return this.router.pathname; }
441
+ get basename() { return this.router.basename || ''; }
442
+ get pageConfig() { return this.config.route; }
443
+ get isTabBar() {
444
+ var _a;
445
+ const routePath = stripBasename(this.pathname, this.basename);
446
+ const pagePath = ((_a = Object.entries(this.customRoutes).find(([, target]) => {
447
+ if (typeof target === 'string') {
448
+ return target === routePath;
449
+ }
450
+ else if ((target === null || target === void 0 ? void 0 : target.length) > 0) {
451
+ return target.includes(routePath);
452
+ }
453
+ return false;
454
+ })) === null || _a === void 0 ? void 0 : _a[0]) || routePath;
455
+ return !!pagePath && this.tabBarList.some(t => t.pagePath === pagePath);
456
+ }
457
+ get search() { return location.search.substr(1); }
458
+ getQuery(search = '', options = {}) {
459
+ search = search ? `${search}&${this.search}` : this.search;
460
+ const query = search
461
+ ? queryString__default["default"].parse(search)
462
+ : {};
463
+ return Object.assign(Object.assign({}, query), options);
464
+ }
465
+ mount() {
466
+ var _a;
467
+ setHistoryMode(this.routerMode, this.router.basename);
468
+ (_a = document.getElementById('app')) === null || _a === void 0 ? void 0 : _a.remove();
469
+ const app = document.createElement('div');
470
+ app.id = this.appId;
471
+ app.classList.add('taro_router');
472
+ if (this.tabBarList.length > 1) {
473
+ const container = document.createElement('div');
474
+ container.classList.add('taro-tabbar__container');
475
+ container.id = 'container';
476
+ const panel = document.createElement('div');
477
+ panel.classList.add('taro-tabbar__panel');
478
+ panel.appendChild(app);
479
+ container.appendChild(panel);
480
+ document.body.appendChild(container);
481
+ initTabbar(this.config);
482
+ }
483
+ else {
484
+ document.body.appendChild(app);
485
+ }
486
+ }
487
+ onReady(page, onLoad = true) {
488
+ var _a;
489
+ const pageEl = this.getPageContainer(page);
490
+ if (pageEl && !(pageEl === null || pageEl === void 0 ? void 0 : pageEl['__isReady'])) {
491
+ const el = pageEl.firstElementChild;
492
+ (_a = el === null || el === void 0 ? void 0 : el['componentOnReady']) === null || _a === void 0 ? void 0 : _a.call(el);
493
+ onLoad && (pageEl['__page'] = page);
494
+ }
495
+ }
496
+ load(page, pageConfig = {}) {
497
+ var _a;
498
+ if (!page)
499
+ return;
500
+ (_a = page.onLoad) === null || _a === void 0 ? void 0 : _a.call(page, this.getQuery('', page.options), () => {
501
+ var _a;
502
+ const pageEl = this.getPageContainer(page);
503
+ this.isTabBar && (pageEl === null || pageEl === void 0 ? void 0 : pageEl.classList.add('taro_tabbar_page'));
504
+ this.onReady(page, true);
505
+ (_a = page.onShow) === null || _a === void 0 ? void 0 : _a.call(page);
506
+ this.bindPageEvents(page, pageEl, pageConfig);
507
+ });
508
+ }
509
+ getPageContainer(page) {
510
+ var _a;
511
+ const path = page ? page === null || page === void 0 ? void 0 : page.path : (_a = runtime.Current.page) === null || _a === void 0 ? void 0 : _a.path;
512
+ const id = path === null || path === void 0 ? void 0 : path.replace(/([^a-z0-9\u00a0-\uffff_-])/ig, '\\$1');
513
+ if (page) {
514
+ return document.querySelector(`.taro_page#${id}`);
515
+ }
516
+ const el = (id
517
+ ? document.querySelector(`.taro_page#${id}`)
518
+ : document.querySelector('.taro_page') ||
519
+ document.querySelector('.taro_router'));
520
+ return el || window;
521
+ }
522
+ bindPageEvents(page, pageEl, config = {}) {
523
+ var _a;
524
+ if (!pageEl) {
525
+ pageEl = this.getPageContainer();
526
+ }
527
+ const distance = config.onReachBottomDistance || ((_a = this.config.window) === null || _a === void 0 ? void 0 : _a.onReachBottomDistance) || 50;
528
+ bindPageScroll(page, pageEl, distance);
529
+ bindPageResize(page);
530
+ }
531
+ }
532
+
533
+ // TODO 支持多路由 (APP 生命周期仅触发一次)
534
+ /** Note: 关于多页面应用
535
+ * - 需要配置路由映射(根目录跳转、404 页面……)
536
+ * - app.onPageNotFound 事件不支持
537
+ * - 应用生命周期可能多次触发
538
+ * - TabBar 会多次加载
539
+ * - 不支持路由动画
540
+ */
541
+ function createMultiRouter(app, config, framework) {
542
+ var _a, _b, _c, _d, _e, _f;
543
+ return __awaiter(this, void 0, void 0, function* () {
544
+ RouterConfig.config = config;
545
+ const handler = new MultiPageHandler(config);
546
+ const launchParam = handler.getQuery();
547
+ (_a = app.onLaunch) === null || _a === void 0 ? void 0 : _a.call(app, launchParam);
548
+ const pathName = config.pageName;
549
+ const pageConfig = handler.pageConfig;
550
+ let element;
551
+ try {
552
+ element = yield ((_b = pageConfig.load) === null || _b === void 0 ? void 0 : _b.call(pageConfig));
553
+ }
554
+ catch (error) {
555
+ throw new Error(error);
556
+ }
557
+ if (!element)
558
+ return;
559
+ let enablePullDownRefresh = ((_c = config === null || config === void 0 ? void 0 : config.window) === null || _c === void 0 ? void 0 : _c.enablePullDownRefresh) || false;
560
+ runtime.eventCenter.trigger('__taroRouterChange', {
561
+ toLocation: {
562
+ path: pathName
563
+ }
564
+ });
565
+ if (pageConfig) {
566
+ document.title = (_d = pageConfig.navigationBarTitleText) !== null && _d !== void 0 ? _d : document.title;
567
+ if (typeof pageConfig.enablePullDownRefresh === 'boolean') {
568
+ enablePullDownRefresh = pageConfig.enablePullDownRefresh;
569
+ }
570
+ }
571
+ const el = (_e = element.default) !== null && _e !== void 0 ? _e : element;
572
+ const loadConfig = Object.assign({}, pageConfig);
573
+ delete loadConfig['path'];
574
+ delete loadConfig['load'];
575
+ const page = runtime.createPageConfig(enablePullDownRefresh ? runtime.hooks.call('createPullDownComponent', el, location.pathname, framework, config.PullDownRefresh) : el, pathName + runtime.stringify(launchParam), {}, loadConfig);
576
+ handler.load(page, pageConfig);
577
+ (_f = app.onShow) === null || _f === void 0 ? void 0 : _f.call(app, launchParam);
578
+ });
579
+ }
580
+
581
+ /**
582
+ * 插入页面动画需要的样式
583
+ */
584
+ function loadAnimateStyle(ms = 300) {
585
+ const css = `
586
+ .taro_router .taro_page {
587
+ position: absolute;
588
+ left: 0;
589
+ top: 0;
590
+ width: 100%;
591
+ height: 100%;
592
+ background-color: #fff;
593
+ transform: translate(100%, 0);
594
+ transition: transform ${ms}ms;
595
+ z-index: 0;
596
+ }
597
+
598
+ .taro_router .taro_page.taro_tabbar_page,
599
+ .taro_router .taro_page.taro_page_show.taro_page_stationed {
600
+ transform: none;
601
+ }
602
+
603
+ .taro_router .taro_page.taro_page_show {
604
+ transform: translate(0, 0);
605
+ }`;
606
+ const style = document.createElement('style');
607
+ style.innerHTML = css;
608
+ document.getElementsByTagName('head')[0].appendChild(style);
609
+ }
610
+
458
611
  function setDisplay(el, type = '') {
459
612
  if (el) {
460
613
  el.style.display = type;
@@ -834,159 +987,6 @@ function createRouter(app, config, framework) {
834
987
  return exports.history.listen(render);
835
988
  }
836
989
 
837
- class MultiPageHandler {
838
- constructor(config) {
839
- this.config = config;
840
- this.mount();
841
- }
842
- get appId() { return 'app'; }
843
- get router() { return this.config.router; }
844
- get routerMode() { return this.router.mode || 'hash'; }
845
- get customRoutes() { return this.router.customRoutes || {}; }
846
- get tabBarList() { var _a; return ((_a = this.config.tabBar) === null || _a === void 0 ? void 0 : _a.list) || []; }
847
- get PullDownRefresh() { return this.config.PullDownRefresh; }
848
- set pathname(p) { this.router.pathname = p; }
849
- get pathname() { return this.router.pathname; }
850
- get basename() { return this.router.basename || ''; }
851
- get pageConfig() { return this.config.route; }
852
- get isTabBar() {
853
- var _a;
854
- const routePath = stripBasename(this.pathname, this.basename);
855
- const pagePath = ((_a = Object.entries(this.customRoutes).find(([, target]) => {
856
- if (typeof target === 'string') {
857
- return target === routePath;
858
- }
859
- else if ((target === null || target === void 0 ? void 0 : target.length) > 0) {
860
- return target.includes(routePath);
861
- }
862
- return false;
863
- })) === null || _a === void 0 ? void 0 : _a[0]) || routePath;
864
- return !!pagePath && this.tabBarList.some(t => t.pagePath === pagePath);
865
- }
866
- get search() { return location.search.substr(1); }
867
- getQuery(search = '', options = {}) {
868
- search = search ? `${search}&${this.search}` : this.search;
869
- const query = search
870
- ? queryString__default["default"].parse(search)
871
- : {};
872
- return Object.assign(Object.assign({}, query), options);
873
- }
874
- mount() {
875
- var _a;
876
- setHistoryMode(this.routerMode, this.router.basename);
877
- (_a = document.getElementById('app')) === null || _a === void 0 ? void 0 : _a.remove();
878
- const app = document.createElement('div');
879
- app.id = this.appId;
880
- app.classList.add('taro_router');
881
- if (this.tabBarList.length > 1) {
882
- const container = document.createElement('div');
883
- container.classList.add('taro-tabbar__container');
884
- container.id = 'container';
885
- const panel = document.createElement('div');
886
- panel.classList.add('taro-tabbar__panel');
887
- panel.appendChild(app);
888
- container.appendChild(panel);
889
- document.body.appendChild(container);
890
- initTabbar(this.config);
891
- }
892
- else {
893
- document.body.appendChild(app);
894
- }
895
- }
896
- onReady(page, onLoad = true) {
897
- var _a;
898
- const pageEl = this.getPageContainer(page);
899
- if (pageEl && !(pageEl === null || pageEl === void 0 ? void 0 : pageEl['__isReady'])) {
900
- const el = pageEl.firstElementChild;
901
- (_a = el === null || el === void 0 ? void 0 : el['componentOnReady']) === null || _a === void 0 ? void 0 : _a.call(el);
902
- onLoad && (pageEl['__page'] = page);
903
- }
904
- }
905
- load(page, pageConfig = {}) {
906
- var _a;
907
- if (!page)
908
- return;
909
- (_a = page.onLoad) === null || _a === void 0 ? void 0 : _a.call(page, this.getQuery('', page.options), () => {
910
- var _a;
911
- const pageEl = this.getPageContainer(page);
912
- this.isTabBar && (pageEl === null || pageEl === void 0 ? void 0 : pageEl.classList.add('taro_tabbar_page'));
913
- this.onReady(page, true);
914
- (_a = page.onShow) === null || _a === void 0 ? void 0 : _a.call(page);
915
- this.bindPageEvents(page, pageEl, pageConfig);
916
- });
917
- }
918
- getPageContainer(page) {
919
- var _a;
920
- const path = page ? page === null || page === void 0 ? void 0 : page.path : (_a = runtime.Current.page) === null || _a === void 0 ? void 0 : _a.path;
921
- const id = path === null || path === void 0 ? void 0 : path.replace(/([^a-z0-9\u00a0-\uffff_-])/ig, '\\$1');
922
- if (page) {
923
- return document.querySelector(`.taro_page#${id}`);
924
- }
925
- const el = (id
926
- ? document.querySelector(`.taro_page#${id}`)
927
- : document.querySelector('.taro_page') ||
928
- document.querySelector('.taro_router'));
929
- return el || window;
930
- }
931
- bindPageEvents(page, pageEl, config = {}) {
932
- var _a;
933
- if (!pageEl) {
934
- pageEl = this.getPageContainer();
935
- }
936
- const distance = config.onReachBottomDistance || ((_a = this.config.window) === null || _a === void 0 ? void 0 : _a.onReachBottomDistance) || 50;
937
- bindPageScroll(page, pageEl, distance);
938
- bindPageResize(page);
939
- }
940
- }
941
-
942
- // TODO 支持多路由 (APP 生命周期仅触发一次)
943
- /** Note: 关于多页面应用
944
- * - 需要配置路由映射(根目录跳转、404 页面……)
945
- * - app.onPageNotFound 事件不支持
946
- * - 应用生命周期可能多次触发
947
- * - TabBar 会多次加载
948
- * - 不支持路由动画
949
- */
950
- function createMultiRouter(app, config, framework) {
951
- var _a, _b, _c, _d, _e, _f;
952
- return __awaiter(this, void 0, void 0, function* () {
953
- RouterConfig.config = config;
954
- const handler = new MultiPageHandler(config);
955
- const launchParam = handler.getQuery();
956
- (_a = app.onLaunch) === null || _a === void 0 ? void 0 : _a.call(app, launchParam);
957
- const pathName = config.pageName;
958
- const pageConfig = handler.pageConfig;
959
- let element;
960
- try {
961
- element = yield ((_b = pageConfig.load) === null || _b === void 0 ? void 0 : _b.call(pageConfig));
962
- }
963
- catch (error) {
964
- throw new Error(error);
965
- }
966
- if (!element)
967
- return;
968
- let enablePullDownRefresh = ((_c = config === null || config === void 0 ? void 0 : config.window) === null || _c === void 0 ? void 0 : _c.enablePullDownRefresh) || false;
969
- runtime.eventCenter.trigger('__taroRouterChange', {
970
- toLocation: {
971
- path: pathName
972
- }
973
- });
974
- if (pageConfig) {
975
- document.title = (_d = pageConfig.navigationBarTitleText) !== null && _d !== void 0 ? _d : document.title;
976
- if (typeof pageConfig.enablePullDownRefresh === 'boolean') {
977
- enablePullDownRefresh = pageConfig.enablePullDownRefresh;
978
- }
979
- }
980
- const el = (_e = element.default) !== null && _e !== void 0 ? _e : element;
981
- const loadConfig = Object.assign({}, pageConfig);
982
- delete loadConfig['path'];
983
- delete loadConfig['load'];
984
- const page = runtime.createPageConfig(enablePullDownRefresh ? runtime.hooks.call('createPullDownComponent', el, location.pathname, framework, config.PullDownRefresh) : el, pathName + runtime.stringify(launchParam), {}, loadConfig);
985
- handler.load(page, pageConfig);
986
- (_f = app.onShow) === null || _f === void 0 ? void 0 : _f.call(app, launchParam);
987
- });
988
- }
989
-
990
990
  exports.createMultiRouter = createMultiRouter;
991
991
  exports.createRouter = createRouter;
992
992
  exports.getCurrentPages = getCurrentPages;