@tarojs/router 3.6.24-nightly.8 → 3.6.24

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.
Files changed (10) hide show
  1. package/dist/index.cjs.js +177 -157
  2. package/dist/index.esm.js +178 -158
  3. package/dist/index.js +2 -2
  4. package/dist/navigationBar.d.ts +2 -1
  5. package/dist/navigationBar.js +13 -6
  6. package/dist/router/mpa.js +9 -4
  7. package/dist/router/navigation-bar.js +12 -13
  8. package/dist/router/spa.js +15 -4
  9. package/dist/style.js +6 -7
  10. package/package.json +5 -5
package/dist/index.cjs.js CHANGED
@@ -8,6 +8,136 @@ var history = require('history');
8
8
  var queryString = require('query-string');
9
9
  var UniversalRouter = require('universal-router');
10
10
 
11
+ /**
12
+ * 插入页面动画需要的样式
13
+ */
14
+ function loadAnimateStyle(ms = 300) {
15
+ const css = `
16
+ body {
17
+ overflow: hidden; // 防止 iOS 页面滚动
18
+ }
19
+ .taro_router > .taro_page {
20
+ position: absolute;
21
+ left: 0;
22
+ top: 0;
23
+ width: 100%;
24
+ height: 100%;
25
+ background-color: #fff;
26
+ transform: translate(100%, 0);
27
+ transition: transform ${ms}ms;
28
+ z-index: 0;
29
+ }
30
+
31
+ .taro_router > .taro_page.taro_tabbar_page,
32
+ .taro_router > .taro_page.taro_page_show.taro_page_stationed {
33
+ transform: none;
34
+ }
35
+
36
+ .taro_router > .taro_page.taro_page_show {
37
+ transform: translate(0, 0);
38
+ }
39
+ `;
40
+ addStyle(css);
41
+ }
42
+ /**
43
+ * 插入路由相关样式
44
+ */
45
+ function loadRouterStyle(enableTabBar, enableWindowScroll) {
46
+ const css = `
47
+ .taro_router {
48
+ position: relative;
49
+ width: 100%;
50
+ height: 100%;
51
+ }
52
+
53
+ .taro_page {
54
+ width: 100%;
55
+ height: 100%;
56
+ ${enableWindowScroll ? '' : `
57
+ overflow-x: hidden;
58
+ overflow-y: scroll;
59
+ max-height: 100vh;
60
+ `}
61
+ }
62
+ ${enableTabBar ? `
63
+ .taro-tabbar__container > .taro-tabbar__panel {
64
+ overflow: hidden;
65
+ }
66
+
67
+ .taro-tabbar__container > .taro-tabbar__panel > .taro_page.taro_tabbar_page {
68
+ max-height: calc(100vh - var(--taro-tabbar-height) - constant(safe-area-inset-bottom));
69
+ max-height: calc(100vh - var(--taro-tabbar-height) - env(safe-area-inset-bottom));
70
+ }
71
+
72
+ ` : ''}
73
+ .taro_page_shade,
74
+ .taro_router > .taro_page.taro_page_show.taro_page_stationed:not(.taro_page_shade):not(.taro_tabbar_page):not(:last-child) {
75
+ display: none;
76
+ }
77
+ `;
78
+ addStyle(css);
79
+ }
80
+ /**
81
+ * 插入导航栏相关的样式
82
+ */
83
+ function loadNavigationBarStyle() {
84
+ const css = `
85
+ .taro-navigation-bar-show {
86
+ background: white;
87
+ position: sticky;
88
+ z-index: 500;
89
+ top: 0;
90
+ padding-bottom: 8px;
91
+ padding-top: calc(env(safe-area-inset-top) + 8px);
92
+ display: flex;
93
+ justify-content: center;
94
+ align-items: center;
95
+ }
96
+
97
+ .taro-navigation-bar-hide {
98
+ display: none;
99
+ }
100
+
101
+ .taro-navigation-bar-title {
102
+ font-size: 24px;
103
+ height: 24px;
104
+ line-height: 24px;
105
+ }
106
+
107
+ .taro-navigation-bar-no-icon > .taro-navigation-bar-home {
108
+ display: none;
109
+ }
110
+
111
+ .taro-navigation-bar-no-icon > .taro-navigation-bar-back {
112
+ display: none;
113
+ }
114
+
115
+ .taro-navigation-bar-home-icon > .taro-navigation-bar-home {
116
+ display: block;
117
+ left: 8px;
118
+ position: absolute;
119
+ width: 24px;
120
+ height: 24px;
121
+ }
122
+
123
+ .taro-navigation-bar-back-icon > .taro-navigation-bar-back {
124
+ display: block;
125
+ left: 8px;
126
+ position: absolute;
127
+ width: 24px;
128
+ height: 24px;
129
+ }
130
+ `;
131
+ addStyle(css);
132
+ }
133
+ function addStyle(css) {
134
+ if (!css)
135
+ return;
136
+ const style = document.createElement('style');
137
+ style.innerHTML = css;
138
+ document.getElementsByTagName('head')[0].appendChild(style);
139
+ }
140
+
11
141
  const home_svg_str = `
12
142
  <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
13
143
  <path d="M23.8899 12.2737C23.8232 12.3584 23.7237 12.3997 23.6198 12.3974H20.7994V23.5996C20.7994 23.8194 20.6213 24 20.4001 24H14.7994C14.5791 24 14.4002 23.8194 14.4002 23.5996V15.6H9.59963V23.5996C9.59963 23.8194 9.42075 24 9.20033 24H3.59968C3.48981 24 3.38964 23.954 3.31764 23.8811C3.24495 23.8091 3.2004 23.7087 3.2004 23.5996V12.3975H0.398546V12.3967C0.296893 12.396 0.194446 12.3544 0.11579 12.2738C-0.0371146 12.114 -0.0400714 11.864 0.11579 11.7076L11.7201 0.117284C11.8767 -0.0390948 12.1298 -0.0390948 12.2863 0.117284L23.8899 11.7076C24.0465 11.864 24.0265 12.0995 23.8899 12.2737ZM12.0029 0.964625L1.37086 11.5854L3.59968 11.5839V11.5999C3.65537 11.5999 3.70804 11.611 3.75557 11.6307C3.89952 11.692 4.00046 11.8339 4.00046 11.9996V23.1991H8.79955V15.2003C8.79955 14.9789 8.97917 14.8002 9.20033 14.8002H14.7995C15.0207 14.8002 15.2003 14.9789 15.2003 15.2003V23.1991H20.0001V11.9996C20.0001 11.8339 20.1003 11.692 20.2443 11.6307C20.2918 11.611 20.3453 11.5999 20.4001 11.5999V11.5713L22.6193 11.5691L12.0029 0.964625Z" fill="currentColor"/>
@@ -17,21 +147,26 @@ const back_svg_str = `
17
147
  <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
18
148
  <path d="M17.8206 22.9016L7.45515 11.8756L17.8206 1.09845C18.0598 0.849741 18.0598 0.435233 17.8206 0.186528C17.5814 -0.0621762 17.1827 -0.0621762 16.9435 0.186528L6.1794 11.4611C5.9402 11.7098 5.9402 12.1244 6.1794 12.3731L16.9435 23.8135C17.1827 24.0622 17.5814 24.0622 17.8206 23.8135C18.0598 23.5648 18.0598 23.1503 17.8206 22.9016Z" fill="currentColor"/>
19
149
  </svg>
20
-
21
150
  `;
22
- function initNavigationBar(container) {
23
- const navigationBar = document.createElement('taro-navigation-bar-wrap');
151
+ function initNavigationBar(config, container) {
152
+ if (config.router.mode === 'multi')
153
+ return;
154
+ const navigationBar = document.createElement('div');
24
155
  navigationBar.classList.add('taro-navigation-bar-no-icon');
25
- const navigationBarBackBtn = document.createElement('taro-navigation-bar-back');
26
- const navigationBarHomeBtn = document.createElement('taro-navigation-bar-home');
156
+ const navigationBarBackBtn = document.createElement('div');
157
+ navigationBarBackBtn.classList.add('taro-navigation-bar-back');
158
+ const navigationBarHomeBtn = document.createElement('div');
159
+ navigationBarHomeBtn.classList.add('taro-navigation-bar-home');
27
160
  navigationBarBackBtn.innerHTML = back_svg_str;
28
161
  navigationBarHomeBtn.innerHTML = home_svg_str;
29
- const navigationBarTitle = document.createElement('taro-navigation-bar-title');
162
+ const navigationBarTitle = document.createElement('div');
163
+ navigationBarTitle.classList.add('taro-navigation-bar-title');
30
164
  navigationBar.appendChild(navigationBarHomeBtn);
31
165
  navigationBar.appendChild(navigationBarBackBtn);
32
166
  navigationBar.appendChild(navigationBarTitle);
33
167
  navigationBar.id = 'taro-navigation-bar';
34
168
  container.prepend(navigationBar);
169
+ loadNavigationBarStyle();
35
170
  }
36
171
 
37
172
  function initTabbar(config, history) {
@@ -507,137 +642,6 @@ function getOffset() {
507
642
  }
508
643
  }
509
644
 
510
- /**
511
- * 插入页面动画需要的样式
512
- */
513
- function loadAnimateStyle(ms = 300) {
514
- const css = `
515
- body {
516
- overflow: hidden; // 防止 iOS 页面滚动
517
- }
518
- .taro_router > .taro_page {
519
- position: absolute;
520
- left: 0;
521
- top: 0;
522
- width: 100%;
523
- height: 100%;
524
- background-color: #fff;
525
- transform: translate(100%, 0);
526
- transition: transform ${ms}ms;
527
- z-index: 0;
528
- }
529
-
530
- .taro_router > .taro_page.taro_tabbar_page,
531
- .taro_router > .taro_page.taro_page_show.taro_page_stationed {
532
- transform: none;
533
- }
534
-
535
- .taro_router > .taro_page.taro_page_show {
536
- transform: translate(0, 0);
537
- }
538
- `;
539
- addStyle(css);
540
- }
541
- /**
542
- * 插入路由相关样式
543
- */
544
- function loadRouterStyle(enableTabBar, enableWindowScroll) {
545
- const css = `
546
- .taro_router {
547
- position: relative;
548
- width: 100%;
549
- height: 100%;
550
- }
551
-
552
- .taro_page {
553
- width: 100%;
554
- height: 100%;
555
- ${enableWindowScroll ? '' : `
556
- overflow-x: hidden;
557
- overflow-y: scroll;
558
- max-height: 100vh;
559
- `}
560
- }
561
- ${enableTabBar ? `
562
- .taro-tabbar__container > .taro-tabbar__panel {
563
- overflow: hidden;
564
- }
565
-
566
- .taro-tabbar__container > .taro-tabbar__panel > .taro_page.taro_tabbar_page {
567
- max-height: calc(100vh - var(--taro-tabbar-height) - constant(safe-area-inset-bottom));
568
- max-height: calc(100vh - var(--taro-tabbar-height) - env(safe-area-inset-bottom));
569
- }
570
-
571
- ` : ''}
572
- .taro_page_shade,
573
- .taro_router > .taro_page.taro_page_show.taro_page_stationed:not(.taro_page_shade):not(.taro_tabbar_page):not(:last-child) {
574
- display: none;
575
- }
576
- `;
577
- addStyle(css);
578
- }
579
- /**
580
- * 插入导航栏相关的样式
581
- */
582
- function loadNavigationBarStyle() {
583
- const css = `
584
- .taro-navigation-bar-show {
585
- background: white;
586
- position: sticky;
587
- z-index: 500;
588
- top: 0;
589
- padding-bottom: 8px;
590
- padding-top: calc(env(safe-area-inset-top) + 8px);
591
- display: flex;
592
- justify-content: center;
593
- align-items: center;
594
- }
595
-
596
- .taro-navigation-bar-hide {
597
- display: none;
598
- }
599
-
600
- taro-navigation-bar-title {
601
- font-size: 24px;
602
- height: 24px;
603
- line-height: 24px;
604
- }
605
-
606
- .taro-navigation-bar-no-icon > taro-navigation-bar-home {
607
- display: none;
608
- }
609
-
610
- .taro-navigation-bar-no-icon > taro-navigation-bar-back {
611
- display: none;
612
- }
613
-
614
- .taro-navigation-bar-home > taro-navigation-bar-home {
615
- display: block;
616
- left: 8px;
617
- position: absolute;
618
- width: 24px;
619
- height: 24px;
620
- }
621
-
622
- .taro-navigation-bar-back > taro-navigation-bar-back {
623
- display: block;
624
- left: 8px;
625
- position: absolute;
626
- width: 24px;
627
- height: 24px;
628
- }
629
-
630
- `;
631
- addStyle(css);
632
- }
633
- function addStyle(css) {
634
- if (!css)
635
- return;
636
- const style = document.createElement('style');
637
- style.innerHTML = css;
638
- document.getElementsByTagName('head')[0].appendChild(style);
639
- }
640
-
641
645
  /* eslint-disable dot-notation */
642
646
  class MultiPageHandler {
643
647
  constructor(config, history) {
@@ -831,12 +835,17 @@ function createMultiRouter(history, app, config, framework) {
831
835
  handler.load(page, pageConfig);
832
836
  (_f = app.onShow) === null || _f === void 0 ? void 0 : _f.call(app, launchParam);
833
837
  window.addEventListener('visibilitychange', () => {
834
- var _a, _b;
838
+ var _a, _b, _c;
839
+ const currentPath = ((_a = runtime.Current.page) === null || _a === void 0 ? void 0 : _a.path) || '';
840
+ const path = currentPath.substring(0, currentPath.indexOf('?'));
841
+ const param = {};
842
+ // app的 onShow/onHide 生命周期的路径信息为当前页面的路径
843
+ Object.assign(param, launchParam, { path });
835
844
  if (document.visibilityState === 'visible') {
836
- (_a = app.onShow) === null || _a === void 0 ? void 0 : _a.call(app, launchParam);
845
+ (_b = app.onShow) === null || _b === void 0 ? void 0 : _b.call(app, param);
837
846
  }
838
847
  else {
839
- (_b = app.onHide) === null || _b === void 0 ? void 0 : _b.call(app, launchParam);
848
+ (_c = app.onHide) === null || _c === void 0 ? void 0 : _c.call(app, param);
840
849
  }
841
850
  });
842
851
  });
@@ -848,7 +857,6 @@ class NavigationBarHandler {
848
857
  this.cache = {};
849
858
  this.pageContext = pageContext;
850
859
  this.init();
851
- loadNavigationBarStyle();
852
860
  runtime.eventCenter.on('__taroH5SetNavigationTitle', (title) => {
853
861
  this.setTitle(title);
854
862
  });
@@ -869,19 +877,19 @@ class NavigationBarHandler {
869
877
  var _a;
870
878
  if (!this.navigationBarElement)
871
879
  return null;
872
- return (_a = this.navigationBarElement.getElementsByTagName('taro-navigation-bar-home')) === null || _a === void 0 ? void 0 : _a[0];
880
+ return (_a = this.navigationBarElement.getElementsByClassName('taro-navigation-bar-home')) === null || _a === void 0 ? void 0 : _a[0];
873
881
  }
874
882
  get backBtnElement() {
875
883
  var _a;
876
884
  if (!this.navigationBarElement)
877
885
  return null;
878
- return (_a = this.navigationBarElement.getElementsByTagName('taro-navigation-bar-back')) === null || _a === void 0 ? void 0 : _a[0];
886
+ return (_a = this.navigationBarElement.getElementsByClassName('taro-navigation-bar-back')) === null || _a === void 0 ? void 0 : _a[0];
879
887
  }
880
888
  get titleElement() {
881
889
  var _a;
882
890
  if (!this.navigationBarElement)
883
891
  return null;
884
- return (_a = this.navigationBarElement.getElementsByTagName('taro-navigation-bar-title')) === null || _a === void 0 ? void 0 : _a[0];
892
+ return (_a = this.navigationBarElement.getElementsByClassName('taro-navigation-bar-title')) === null || _a === void 0 ? void 0 : _a[0];
885
893
  }
886
894
  init() {
887
895
  var _a, _b;
@@ -892,8 +900,7 @@ class NavigationBarHandler {
892
900
  (_b = this.backBtnElement) === null || _b === void 0 ? void 0 : _b.addEventListener('click', this.backFn.bind(this));
893
901
  }
894
902
  setNavigationBarElement() {
895
- var _a;
896
- this.navigationBarElement = (_a = document.getElementsByTagName('taro-navigation-bar-wrap')) === null || _a === void 0 ? void 0 : _a[0];
903
+ this.navigationBarElement = document.getElementById('taro-navigation-bar');
897
904
  }
898
905
  load() {
899
906
  this.setCacheValue();
@@ -1005,23 +1012,25 @@ class NavigationBarHandler {
1005
1012
  fnBtnToggleToHome() {
1006
1013
  if (!this.navigationBarElement)
1007
1014
  return;
1008
- this.navigationBarElement.classList.add('taro-navigation-bar-home');
1009
- this.navigationBarElement.classList.remove('taro-navigation-bar-back');
1015
+ this.navigationBarElement.classList.add('taro-navigation-bar-home-icon');
1016
+ this.navigationBarElement.classList.remove('taro-navigation-bar-back-icon');
1010
1017
  }
1011
1018
  fnBtnToggleToBack() {
1012
1019
  if (!this.navigationBarElement)
1013
1020
  return;
1014
- this.navigationBarElement.classList.remove('taro-navigation-bar-home');
1015
- this.navigationBarElement.classList.add('taro-navigation-bar-back');
1021
+ this.navigationBarElement.classList.remove('taro-navigation-bar-home-icon');
1022
+ this.navigationBarElement.classList.add('taro-navigation-bar-back-icon');
1016
1023
  }
1017
1024
  fnBtnToggleToNone() {
1018
1025
  if (!this.navigationBarElement)
1019
1026
  return;
1020
- this.navigationBarElement.classList.remove('taro-navigation-bar-home');
1021
- this.navigationBarElement.classList.remove('taro-navigation-bar-back');
1027
+ this.navigationBarElement.classList.remove('taro-navigation-bar-home-icon');
1028
+ this.navigationBarElement.classList.remove('taro-navigation-bar-back-icon');
1022
1029
  }
1023
1030
  setNavigationBarVisible(show) {
1024
1031
  var _a, _b;
1032
+ if (!this.navigationBarElement)
1033
+ return;
1025
1034
  let shouldShow;
1026
1035
  if (typeof show === 'boolean') {
1027
1036
  shouldShow = show;
@@ -1538,12 +1547,23 @@ function createRouter(history$1, app, config, framework) {
1538
1547
  render({ location: history$1.location, action: history.Action.Push });
1539
1548
  (_b = app.onShow) === null || _b === void 0 ? void 0 : _b.call(app, launchParam);
1540
1549
  window.addEventListener('visibilitychange', () => {
1541
- var _a, _b;
1550
+ var _a, _b, _c, _d, _e, _f, _g;
1551
+ const currentPath = ((_a = runtime.Current.page) === null || _a === void 0 ? void 0 : _a.path) || '';
1552
+ const path = currentPath.substring(0, currentPath.indexOf('?'));
1553
+ const param = {};
1554
+ // app的 onShow/onHide 生命周期的路径信息为当前页面的路径
1555
+ Object.assign(param, launchParam, { path });
1542
1556
  if (document.visibilityState === 'visible') {
1543
- (_a = app.onShow) === null || _a === void 0 ? void 0 : _a.call(app, launchParam);
1557
+ (_b = app.onShow) === null || _b === void 0 ? void 0 : _b.call(app, param);
1558
+ // 单页面app显示后一刻会触发当前 page.onShow 生命周期函数
1559
+ (_d = (_c = runtime.Current.page) === null || _c === void 0 ? void 0 : _c.onShow) === null || _d === void 0 ? void 0 : _d.call(_c);
1544
1560
  }
1545
1561
  else {
1546
- (_b = app.onHide) === null || _b === void 0 ? void 0 : _b.call(app, launchParam);
1562
+ // 单页面app隐藏前一刻会触发当前 page.onHide 生命周期函数
1563
+ if ((_e = runtime.Current.page) === null || _e === void 0 ? void 0 : _e.path) {
1564
+ runtime.safeExecute((_f = runtime.Current.page) === null || _f === void 0 ? void 0 : _f.path, 'onHide');
1565
+ }
1566
+ (_g = app.onHide) === null || _g === void 0 ? void 0 : _g.call(app, param);
1547
1567
  }
1548
1568
  });
1549
1569
  return history$1.listen(render);
@@ -1561,7 +1581,7 @@ function handleAppMount(config, _, appId = config.appId || 'app') {
1561
1581
  app.classList.add('taro_router');
1562
1582
  if (!isPosition)
1563
1583
  appWrapper.appendChild(app);
1564
- initNavigationBar(appWrapper);
1584
+ initNavigationBar(config, appWrapper);
1565
1585
  }
1566
1586
  function handleAppMountWithTabbar(config, history, appId = config.appId || 'app') {
1567
1587
  let app = document.getElementById(appId);
@@ -1587,7 +1607,7 @@ function handleAppMountWithTabbar(config, history, appId = config.appId || 'app'
1587
1607
  appWrapper.replaceChild(container, app);
1588
1608
  }
1589
1609
  initTabbar(config, history);
1590
- initNavigationBar(container);
1610
+ initNavigationBar(config, container);
1591
1611
  }
1592
1612
 
1593
1613
  Object.defineProperty(exports, 'createBrowserHistory', {
package/dist/index.esm.js CHANGED
@@ -1,12 +1,142 @@
1
1
  import { defineCustomElementTaroTabbar } from '@tarojs/components/dist/components';
2
2
  import { initTabBarApis } from '@tarojs/taro';
3
3
  import { __awaiter } from 'tslib';
4
- import { addLeadingSlash, eventCenter, Current, stripBasename, incrementId, createPageConfig, hooks, stringify, getHomePage, getCurrentPage, stripTrailing, requestAnimationFrame as requestAnimationFrame$1 } from '@tarojs/runtime';
4
+ import { addLeadingSlash, eventCenter, Current, stripBasename, incrementId, createPageConfig, hooks, stringify, getHomePage, getCurrentPage, stripTrailing, requestAnimationFrame as requestAnimationFrame$1, safeExecute } from '@tarojs/runtime';
5
5
  import { createBrowserHistory, createHashHistory, Action, parsePath } from 'history';
6
6
  export { createBrowserHistory, createHashHistory } from 'history';
7
7
  import queryString from 'query-string';
8
8
  import UniversalRouter from 'universal-router';
9
9
 
10
+ /**
11
+ * 插入页面动画需要的样式
12
+ */
13
+ function loadAnimateStyle(ms = 300) {
14
+ const css = `
15
+ body {
16
+ overflow: hidden; // 防止 iOS 页面滚动
17
+ }
18
+ .taro_router > .taro_page {
19
+ position: absolute;
20
+ left: 0;
21
+ top: 0;
22
+ width: 100%;
23
+ height: 100%;
24
+ background-color: #fff;
25
+ transform: translate(100%, 0);
26
+ transition: transform ${ms}ms;
27
+ z-index: 0;
28
+ }
29
+
30
+ .taro_router > .taro_page.taro_tabbar_page,
31
+ .taro_router > .taro_page.taro_page_show.taro_page_stationed {
32
+ transform: none;
33
+ }
34
+
35
+ .taro_router > .taro_page.taro_page_show {
36
+ transform: translate(0, 0);
37
+ }
38
+ `;
39
+ addStyle(css);
40
+ }
41
+ /**
42
+ * 插入路由相关样式
43
+ */
44
+ function loadRouterStyle(enableTabBar, enableWindowScroll) {
45
+ const css = `
46
+ .taro_router {
47
+ position: relative;
48
+ width: 100%;
49
+ height: 100%;
50
+ }
51
+
52
+ .taro_page {
53
+ width: 100%;
54
+ height: 100%;
55
+ ${enableWindowScroll ? '' : `
56
+ overflow-x: hidden;
57
+ overflow-y: scroll;
58
+ max-height: 100vh;
59
+ `}
60
+ }
61
+ ${enableTabBar ? `
62
+ .taro-tabbar__container > .taro-tabbar__panel {
63
+ overflow: hidden;
64
+ }
65
+
66
+ .taro-tabbar__container > .taro-tabbar__panel > .taro_page.taro_tabbar_page {
67
+ max-height: calc(100vh - var(--taro-tabbar-height) - constant(safe-area-inset-bottom));
68
+ max-height: calc(100vh - var(--taro-tabbar-height) - env(safe-area-inset-bottom));
69
+ }
70
+
71
+ ` : ''}
72
+ .taro_page_shade,
73
+ .taro_router > .taro_page.taro_page_show.taro_page_stationed:not(.taro_page_shade):not(.taro_tabbar_page):not(:last-child) {
74
+ display: none;
75
+ }
76
+ `;
77
+ addStyle(css);
78
+ }
79
+ /**
80
+ * 插入导航栏相关的样式
81
+ */
82
+ function loadNavigationBarStyle() {
83
+ const css = `
84
+ .taro-navigation-bar-show {
85
+ background: white;
86
+ position: sticky;
87
+ z-index: 500;
88
+ top: 0;
89
+ padding-bottom: 8px;
90
+ padding-top: calc(env(safe-area-inset-top) + 8px);
91
+ display: flex;
92
+ justify-content: center;
93
+ align-items: center;
94
+ }
95
+
96
+ .taro-navigation-bar-hide {
97
+ display: none;
98
+ }
99
+
100
+ .taro-navigation-bar-title {
101
+ font-size: 24px;
102
+ height: 24px;
103
+ line-height: 24px;
104
+ }
105
+
106
+ .taro-navigation-bar-no-icon > .taro-navigation-bar-home {
107
+ display: none;
108
+ }
109
+
110
+ .taro-navigation-bar-no-icon > .taro-navigation-bar-back {
111
+ display: none;
112
+ }
113
+
114
+ .taro-navigation-bar-home-icon > .taro-navigation-bar-home {
115
+ display: block;
116
+ left: 8px;
117
+ position: absolute;
118
+ width: 24px;
119
+ height: 24px;
120
+ }
121
+
122
+ .taro-navigation-bar-back-icon > .taro-navigation-bar-back {
123
+ display: block;
124
+ left: 8px;
125
+ position: absolute;
126
+ width: 24px;
127
+ height: 24px;
128
+ }
129
+ `;
130
+ addStyle(css);
131
+ }
132
+ function addStyle(css) {
133
+ if (!css)
134
+ return;
135
+ const style = document.createElement('style');
136
+ style.innerHTML = css;
137
+ document.getElementsByTagName('head')[0].appendChild(style);
138
+ }
139
+
10
140
  const home_svg_str = `
11
141
  <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
12
142
  <path d="M23.8899 12.2737C23.8232 12.3584 23.7237 12.3997 23.6198 12.3974H20.7994V23.5996C20.7994 23.8194 20.6213 24 20.4001 24H14.7994C14.5791 24 14.4002 23.8194 14.4002 23.5996V15.6H9.59963V23.5996C9.59963 23.8194 9.42075 24 9.20033 24H3.59968C3.48981 24 3.38964 23.954 3.31764 23.8811C3.24495 23.8091 3.2004 23.7087 3.2004 23.5996V12.3975H0.398546V12.3967C0.296893 12.396 0.194446 12.3544 0.11579 12.2738C-0.0371146 12.114 -0.0400714 11.864 0.11579 11.7076L11.7201 0.117284C11.8767 -0.0390948 12.1298 -0.0390948 12.2863 0.117284L23.8899 11.7076C24.0465 11.864 24.0265 12.0995 23.8899 12.2737ZM12.0029 0.964625L1.37086 11.5854L3.59968 11.5839V11.5999C3.65537 11.5999 3.70804 11.611 3.75557 11.6307C3.89952 11.692 4.00046 11.8339 4.00046 11.9996V23.1991H8.79955V15.2003C8.79955 14.9789 8.97917 14.8002 9.20033 14.8002H14.7995C15.0207 14.8002 15.2003 14.9789 15.2003 15.2003V23.1991H20.0001V11.9996C20.0001 11.8339 20.1003 11.692 20.2443 11.6307C20.2918 11.611 20.3453 11.5999 20.4001 11.5999V11.5713L22.6193 11.5691L12.0029 0.964625Z" fill="currentColor"/>
@@ -16,21 +146,26 @@ const back_svg_str = `
16
146
  <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
17
147
  <path d="M17.8206 22.9016L7.45515 11.8756L17.8206 1.09845C18.0598 0.849741 18.0598 0.435233 17.8206 0.186528C17.5814 -0.0621762 17.1827 -0.0621762 16.9435 0.186528L6.1794 11.4611C5.9402 11.7098 5.9402 12.1244 6.1794 12.3731L16.9435 23.8135C17.1827 24.0622 17.5814 24.0622 17.8206 23.8135C18.0598 23.5648 18.0598 23.1503 17.8206 22.9016Z" fill="currentColor"/>
18
148
  </svg>
19
-
20
149
  `;
21
- function initNavigationBar(container) {
22
- const navigationBar = document.createElement('taro-navigation-bar-wrap');
150
+ function initNavigationBar(config, container) {
151
+ if (config.router.mode === 'multi')
152
+ return;
153
+ const navigationBar = document.createElement('div');
23
154
  navigationBar.classList.add('taro-navigation-bar-no-icon');
24
- const navigationBarBackBtn = document.createElement('taro-navigation-bar-back');
25
- const navigationBarHomeBtn = document.createElement('taro-navigation-bar-home');
155
+ const navigationBarBackBtn = document.createElement('div');
156
+ navigationBarBackBtn.classList.add('taro-navigation-bar-back');
157
+ const navigationBarHomeBtn = document.createElement('div');
158
+ navigationBarHomeBtn.classList.add('taro-navigation-bar-home');
26
159
  navigationBarBackBtn.innerHTML = back_svg_str;
27
160
  navigationBarHomeBtn.innerHTML = home_svg_str;
28
- const navigationBarTitle = document.createElement('taro-navigation-bar-title');
161
+ const navigationBarTitle = document.createElement('div');
162
+ navigationBarTitle.classList.add('taro-navigation-bar-title');
29
163
  navigationBar.appendChild(navigationBarHomeBtn);
30
164
  navigationBar.appendChild(navigationBarBackBtn);
31
165
  navigationBar.appendChild(navigationBarTitle);
32
166
  navigationBar.id = 'taro-navigation-bar';
33
167
  container.prepend(navigationBar);
168
+ loadNavigationBarStyle();
34
169
  }
35
170
 
36
171
  function initTabbar(config, history) {
@@ -506,137 +641,6 @@ function getOffset() {
506
641
  }
507
642
  }
508
643
 
509
- /**
510
- * 插入页面动画需要的样式
511
- */
512
- function loadAnimateStyle(ms = 300) {
513
- const css = `
514
- body {
515
- overflow: hidden; // 防止 iOS 页面滚动
516
- }
517
- .taro_router > .taro_page {
518
- position: absolute;
519
- left: 0;
520
- top: 0;
521
- width: 100%;
522
- height: 100%;
523
- background-color: #fff;
524
- transform: translate(100%, 0);
525
- transition: transform ${ms}ms;
526
- z-index: 0;
527
- }
528
-
529
- .taro_router > .taro_page.taro_tabbar_page,
530
- .taro_router > .taro_page.taro_page_show.taro_page_stationed {
531
- transform: none;
532
- }
533
-
534
- .taro_router > .taro_page.taro_page_show {
535
- transform: translate(0, 0);
536
- }
537
- `;
538
- addStyle(css);
539
- }
540
- /**
541
- * 插入路由相关样式
542
- */
543
- function loadRouterStyle(enableTabBar, enableWindowScroll) {
544
- const css = `
545
- .taro_router {
546
- position: relative;
547
- width: 100%;
548
- height: 100%;
549
- }
550
-
551
- .taro_page {
552
- width: 100%;
553
- height: 100%;
554
- ${enableWindowScroll ? '' : `
555
- overflow-x: hidden;
556
- overflow-y: scroll;
557
- max-height: 100vh;
558
- `}
559
- }
560
- ${enableTabBar ? `
561
- .taro-tabbar__container > .taro-tabbar__panel {
562
- overflow: hidden;
563
- }
564
-
565
- .taro-tabbar__container > .taro-tabbar__panel > .taro_page.taro_tabbar_page {
566
- max-height: calc(100vh - var(--taro-tabbar-height) - constant(safe-area-inset-bottom));
567
- max-height: calc(100vh - var(--taro-tabbar-height) - env(safe-area-inset-bottom));
568
- }
569
-
570
- ` : ''}
571
- .taro_page_shade,
572
- .taro_router > .taro_page.taro_page_show.taro_page_stationed:not(.taro_page_shade):not(.taro_tabbar_page):not(:last-child) {
573
- display: none;
574
- }
575
- `;
576
- addStyle(css);
577
- }
578
- /**
579
- * 插入导航栏相关的样式
580
- */
581
- function loadNavigationBarStyle() {
582
- const css = `
583
- .taro-navigation-bar-show {
584
- background: white;
585
- position: sticky;
586
- z-index: 500;
587
- top: 0;
588
- padding-bottom: 8px;
589
- padding-top: calc(env(safe-area-inset-top) + 8px);
590
- display: flex;
591
- justify-content: center;
592
- align-items: center;
593
- }
594
-
595
- .taro-navigation-bar-hide {
596
- display: none;
597
- }
598
-
599
- taro-navigation-bar-title {
600
- font-size: 24px;
601
- height: 24px;
602
- line-height: 24px;
603
- }
604
-
605
- .taro-navigation-bar-no-icon > taro-navigation-bar-home {
606
- display: none;
607
- }
608
-
609
- .taro-navigation-bar-no-icon > taro-navigation-bar-back {
610
- display: none;
611
- }
612
-
613
- .taro-navigation-bar-home > taro-navigation-bar-home {
614
- display: block;
615
- left: 8px;
616
- position: absolute;
617
- width: 24px;
618
- height: 24px;
619
- }
620
-
621
- .taro-navigation-bar-back > taro-navigation-bar-back {
622
- display: block;
623
- left: 8px;
624
- position: absolute;
625
- width: 24px;
626
- height: 24px;
627
- }
628
-
629
- `;
630
- addStyle(css);
631
- }
632
- function addStyle(css) {
633
- if (!css)
634
- return;
635
- const style = document.createElement('style');
636
- style.innerHTML = css;
637
- document.getElementsByTagName('head')[0].appendChild(style);
638
- }
639
-
640
644
  /* eslint-disable dot-notation */
641
645
  class MultiPageHandler {
642
646
  constructor(config, history) {
@@ -830,12 +834,17 @@ function createMultiRouter(history, app, config, framework) {
830
834
  handler.load(page, pageConfig);
831
835
  (_f = app.onShow) === null || _f === void 0 ? void 0 : _f.call(app, launchParam);
832
836
  window.addEventListener('visibilitychange', () => {
833
- var _a, _b;
837
+ var _a, _b, _c;
838
+ const currentPath = ((_a = Current.page) === null || _a === void 0 ? void 0 : _a.path) || '';
839
+ const path = currentPath.substring(0, currentPath.indexOf('?'));
840
+ const param = {};
841
+ // app的 onShow/onHide 生命周期的路径信息为当前页面的路径
842
+ Object.assign(param, launchParam, { path });
834
843
  if (document.visibilityState === 'visible') {
835
- (_a = app.onShow) === null || _a === void 0 ? void 0 : _a.call(app, launchParam);
844
+ (_b = app.onShow) === null || _b === void 0 ? void 0 : _b.call(app, param);
836
845
  }
837
846
  else {
838
- (_b = app.onHide) === null || _b === void 0 ? void 0 : _b.call(app, launchParam);
847
+ (_c = app.onHide) === null || _c === void 0 ? void 0 : _c.call(app, param);
839
848
  }
840
849
  });
841
850
  });
@@ -847,7 +856,6 @@ class NavigationBarHandler {
847
856
  this.cache = {};
848
857
  this.pageContext = pageContext;
849
858
  this.init();
850
- loadNavigationBarStyle();
851
859
  eventCenter.on('__taroH5SetNavigationTitle', (title) => {
852
860
  this.setTitle(title);
853
861
  });
@@ -868,19 +876,19 @@ class NavigationBarHandler {
868
876
  var _a;
869
877
  if (!this.navigationBarElement)
870
878
  return null;
871
- return (_a = this.navigationBarElement.getElementsByTagName('taro-navigation-bar-home')) === null || _a === void 0 ? void 0 : _a[0];
879
+ return (_a = this.navigationBarElement.getElementsByClassName('taro-navigation-bar-home')) === null || _a === void 0 ? void 0 : _a[0];
872
880
  }
873
881
  get backBtnElement() {
874
882
  var _a;
875
883
  if (!this.navigationBarElement)
876
884
  return null;
877
- return (_a = this.navigationBarElement.getElementsByTagName('taro-navigation-bar-back')) === null || _a === void 0 ? void 0 : _a[0];
885
+ return (_a = this.navigationBarElement.getElementsByClassName('taro-navigation-bar-back')) === null || _a === void 0 ? void 0 : _a[0];
878
886
  }
879
887
  get titleElement() {
880
888
  var _a;
881
889
  if (!this.navigationBarElement)
882
890
  return null;
883
- return (_a = this.navigationBarElement.getElementsByTagName('taro-navigation-bar-title')) === null || _a === void 0 ? void 0 : _a[0];
891
+ return (_a = this.navigationBarElement.getElementsByClassName('taro-navigation-bar-title')) === null || _a === void 0 ? void 0 : _a[0];
884
892
  }
885
893
  init() {
886
894
  var _a, _b;
@@ -891,8 +899,7 @@ class NavigationBarHandler {
891
899
  (_b = this.backBtnElement) === null || _b === void 0 ? void 0 : _b.addEventListener('click', this.backFn.bind(this));
892
900
  }
893
901
  setNavigationBarElement() {
894
- var _a;
895
- this.navigationBarElement = (_a = document.getElementsByTagName('taro-navigation-bar-wrap')) === null || _a === void 0 ? void 0 : _a[0];
902
+ this.navigationBarElement = document.getElementById('taro-navigation-bar');
896
903
  }
897
904
  load() {
898
905
  this.setCacheValue();
@@ -1004,23 +1011,25 @@ class NavigationBarHandler {
1004
1011
  fnBtnToggleToHome() {
1005
1012
  if (!this.navigationBarElement)
1006
1013
  return;
1007
- this.navigationBarElement.classList.add('taro-navigation-bar-home');
1008
- this.navigationBarElement.classList.remove('taro-navigation-bar-back');
1014
+ this.navigationBarElement.classList.add('taro-navigation-bar-home-icon');
1015
+ this.navigationBarElement.classList.remove('taro-navigation-bar-back-icon');
1009
1016
  }
1010
1017
  fnBtnToggleToBack() {
1011
1018
  if (!this.navigationBarElement)
1012
1019
  return;
1013
- this.navigationBarElement.classList.remove('taro-navigation-bar-home');
1014
- this.navigationBarElement.classList.add('taro-navigation-bar-back');
1020
+ this.navigationBarElement.classList.remove('taro-navigation-bar-home-icon');
1021
+ this.navigationBarElement.classList.add('taro-navigation-bar-back-icon');
1015
1022
  }
1016
1023
  fnBtnToggleToNone() {
1017
1024
  if (!this.navigationBarElement)
1018
1025
  return;
1019
- this.navigationBarElement.classList.remove('taro-navigation-bar-home');
1020
- this.navigationBarElement.classList.remove('taro-navigation-bar-back');
1026
+ this.navigationBarElement.classList.remove('taro-navigation-bar-home-icon');
1027
+ this.navigationBarElement.classList.remove('taro-navigation-bar-back-icon');
1021
1028
  }
1022
1029
  setNavigationBarVisible(show) {
1023
1030
  var _a, _b;
1031
+ if (!this.navigationBarElement)
1032
+ return;
1024
1033
  let shouldShow;
1025
1034
  if (typeof show === 'boolean') {
1026
1035
  shouldShow = show;
@@ -1537,12 +1546,23 @@ function createRouter(history, app, config, framework) {
1537
1546
  render({ location: history.location, action: Action.Push });
1538
1547
  (_b = app.onShow) === null || _b === void 0 ? void 0 : _b.call(app, launchParam);
1539
1548
  window.addEventListener('visibilitychange', () => {
1540
- var _a, _b;
1549
+ var _a, _b, _c, _d, _e, _f, _g;
1550
+ const currentPath = ((_a = Current.page) === null || _a === void 0 ? void 0 : _a.path) || '';
1551
+ const path = currentPath.substring(0, currentPath.indexOf('?'));
1552
+ const param = {};
1553
+ // app的 onShow/onHide 生命周期的路径信息为当前页面的路径
1554
+ Object.assign(param, launchParam, { path });
1541
1555
  if (document.visibilityState === 'visible') {
1542
- (_a = app.onShow) === null || _a === void 0 ? void 0 : _a.call(app, launchParam);
1556
+ (_b = app.onShow) === null || _b === void 0 ? void 0 : _b.call(app, param);
1557
+ // 单页面app显示后一刻会触发当前 page.onShow 生命周期函数
1558
+ (_d = (_c = Current.page) === null || _c === void 0 ? void 0 : _c.onShow) === null || _d === void 0 ? void 0 : _d.call(_c);
1543
1559
  }
1544
1560
  else {
1545
- (_b = app.onHide) === null || _b === void 0 ? void 0 : _b.call(app, launchParam);
1561
+ // 单页面app隐藏前一刻会触发当前 page.onHide 生命周期函数
1562
+ if ((_e = Current.page) === null || _e === void 0 ? void 0 : _e.path) {
1563
+ safeExecute((_f = Current.page) === null || _f === void 0 ? void 0 : _f.path, 'onHide');
1564
+ }
1565
+ (_g = app.onHide) === null || _g === void 0 ? void 0 : _g.call(app, param);
1546
1566
  }
1547
1567
  });
1548
1568
  return history.listen(render);
@@ -1560,7 +1580,7 @@ function handleAppMount(config, _, appId = config.appId || 'app') {
1560
1580
  app.classList.add('taro_router');
1561
1581
  if (!isPosition)
1562
1582
  appWrapper.appendChild(app);
1563
- initNavigationBar(appWrapper);
1583
+ initNavigationBar(config, appWrapper);
1564
1584
  }
1565
1585
  function handleAppMountWithTabbar(config, history, appId = config.appId || 'app') {
1566
1586
  let app = document.getElementById(appId);
@@ -1586,7 +1606,7 @@ function handleAppMountWithTabbar(config, history, appId = config.appId || 'app'
1586
1606
  appWrapper.replaceChild(container, app);
1587
1607
  }
1588
1608
  initTabbar(config, history);
1589
- initNavigationBar(container);
1609
+ initNavigationBar(config, container);
1590
1610
  }
1591
1611
 
1592
1612
  export { createMpaHistory, createMultiRouter, createRouter, getCurrentPages, handleAppMount, handleAppMountWithTabbar, history, isDingTalk, isWeixin, navigateBack, navigateTo, prependBasename, reLaunch, redirectTo, routesAlias, setHistory, setHistoryMode, setMpaTitle, setNavigationBarStyle, setTitle, switchTab };
package/dist/index.js CHANGED
@@ -20,7 +20,7 @@ function handleAppMount(config, _, appId = config.appId || 'app') {
20
20
  app.classList.add('taro_router');
21
21
  if (!isPosition)
22
22
  appWrapper.appendChild(app);
23
- initNavigationBar(appWrapper);
23
+ initNavigationBar(config, appWrapper);
24
24
  }
25
25
  function handleAppMountWithTabbar(config, history, appId = config.appId || 'app') {
26
26
  let app = document.getElementById(appId);
@@ -46,7 +46,7 @@ function handleAppMountWithTabbar(config, history, appId = config.appId || 'app'
46
46
  appWrapper.replaceChild(container, app);
47
47
  }
48
48
  initTabbar(config, history);
49
- initNavigationBar(container);
49
+ initNavigationBar(config, container);
50
50
  }
51
51
 
52
52
  export { handleAppMount, handleAppMountWithTabbar };
package/dist/navigationBar.d.ts CHANGED
@@ -1,2 +1,3 @@
1
- declare function initNavigationBar(container: HTMLElement): void;
1
+ import { MpaRouterConfig, SpaRouterConfig } from '../types/router';
2
+ declare function initNavigationBar(config: SpaRouterConfig | MpaRouterConfig, container: HTMLElement): void;
2
3
  export { initNavigationBar };
package/dist/navigationBar.js CHANGED
@@ -1,3 +1,5 @@
1
+ import { loadNavigationBarStyle } from './style.js';
2
+
1
3
  const home_svg_str = `
2
4
  <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
3
5
  <path d="M23.8899 12.2737C23.8232 12.3584 23.7237 12.3997 23.6198 12.3974H20.7994V23.5996C20.7994 23.8194 20.6213 24 20.4001 24H14.7994C14.5791 24 14.4002 23.8194 14.4002 23.5996V15.6H9.59963V23.5996C9.59963 23.8194 9.42075 24 9.20033 24H3.59968C3.48981 24 3.38964 23.954 3.31764 23.8811C3.24495 23.8091 3.2004 23.7087 3.2004 23.5996V12.3975H0.398546V12.3967C0.296893 12.396 0.194446 12.3544 0.11579 12.2738C-0.0371146 12.114 -0.0400714 11.864 0.11579 11.7076L11.7201 0.117284C11.8767 -0.0390948 12.1298 -0.0390948 12.2863 0.117284L23.8899 11.7076C24.0465 11.864 24.0265 12.0995 23.8899 12.2737ZM12.0029 0.964625L1.37086 11.5854L3.59968 11.5839V11.5999C3.65537 11.5999 3.70804 11.611 3.75557 11.6307C3.89952 11.692 4.00046 11.8339 4.00046 11.9996V23.1991H8.79955V15.2003C8.79955 14.9789 8.97917 14.8002 9.20033 14.8002H14.7995C15.0207 14.8002 15.2003 14.9789 15.2003 15.2003V23.1991H20.0001V11.9996C20.0001 11.8339 20.1003 11.692 20.2443 11.6307C20.2918 11.611 20.3453 11.5999 20.4001 11.5999V11.5713L22.6193 11.5691L12.0029 0.964625Z" fill="currentColor"/>
@@ -7,21 +9,26 @@ const back_svg_str = `
7
9
  <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
8
10
  <path d="M17.8206 22.9016L7.45515 11.8756L17.8206 1.09845C18.0598 0.849741 18.0598 0.435233 17.8206 0.186528C17.5814 -0.0621762 17.1827 -0.0621762 16.9435 0.186528L6.1794 11.4611C5.9402 11.7098 5.9402 12.1244 6.1794 12.3731L16.9435 23.8135C17.1827 24.0622 17.5814 24.0622 17.8206 23.8135C18.0598 23.5648 18.0598 23.1503 17.8206 22.9016Z" fill="currentColor"/>
9
11
  </svg>
10
-
11
12
  `;
12
- function initNavigationBar(container) {
13
- const navigationBar = document.createElement('taro-navigation-bar-wrap');
13
+ function initNavigationBar(config, container) {
14
+ if (config.router.mode === 'multi')
15
+ return;
16
+ const navigationBar = document.createElement('div');
14
17
  navigationBar.classList.add('taro-navigation-bar-no-icon');
15
- const navigationBarBackBtn = document.createElement('taro-navigation-bar-back');
16
- const navigationBarHomeBtn = document.createElement('taro-navigation-bar-home');
18
+ const navigationBarBackBtn = document.createElement('div');
19
+ navigationBarBackBtn.classList.add('taro-navigation-bar-back');
20
+ const navigationBarHomeBtn = document.createElement('div');
21
+ navigationBarHomeBtn.classList.add('taro-navigation-bar-home');
17
22
  navigationBarBackBtn.innerHTML = back_svg_str;
18
23
  navigationBarHomeBtn.innerHTML = home_svg_str;
19
- const navigationBarTitle = document.createElement('taro-navigation-bar-title');
24
+ const navigationBarTitle = document.createElement('div');
25
+ navigationBarTitle.classList.add('taro-navigation-bar-title');
20
26
  navigationBar.appendChild(navigationBarHomeBtn);
21
27
  navigationBar.appendChild(navigationBarBackBtn);
22
28
  navigationBar.appendChild(navigationBarTitle);
23
29
  navigationBar.id = 'taro-navigation-bar';
24
30
  container.prepend(navigationBar);
31
+ loadNavigationBarStyle();
25
32
  }
26
33
 
27
34
  export { initNavigationBar };
package/dist/router/mpa.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { __awaiter } from 'tslib';
2
- import { incrementId, eventCenter, createPageConfig, hooks, stringify } from '@tarojs/runtime';
2
+ import { incrementId, eventCenter, createPageConfig, hooks, stringify, Current } from '@tarojs/runtime';
3
3
  import '../utils/index.js';
4
4
  import { RouterConfig } from './index.js';
5
5
  import MultiPageHandler from './multi-page.js';
@@ -68,12 +68,17 @@ function createMultiRouter(history, app, config, framework) {
68
68
  handler.load(page, pageConfig);
69
69
  (_f = app.onShow) === null || _f === void 0 ? void 0 : _f.call(app, launchParam);
70
70
  window.addEventListener('visibilitychange', () => {
71
- var _a, _b;
71
+ var _a, _b, _c;
72
+ const currentPath = ((_a = Current.page) === null || _a === void 0 ? void 0 : _a.path) || '';
73
+ const path = currentPath.substring(0, currentPath.indexOf('?'));
74
+ const param = {};
75
+ // app的 onShow/onHide 生命周期的路径信息为当前页面的路径
76
+ Object.assign(param, launchParam, { path });
72
77
  if (document.visibilityState === 'visible') {
73
- (_a = app.onShow) === null || _a === void 0 ? void 0 : _a.call(app, launchParam);
78
+ (_b = app.onShow) === null || _b === void 0 ? void 0 : _b.call(app, param);
74
79
  }
75
80
  else {
76
- (_b = app.onHide) === null || _b === void 0 ? void 0 : _b.call(app, launchParam);
81
+ (_c = app.onHide) === null || _c === void 0 ? void 0 : _c.call(app, param);
77
82
  }
78
83
  });
79
84
  });
package/dist/router/navigation-bar.js CHANGED
@@ -1,6 +1,5 @@
1
1
  import { eventCenter } from '@tarojs/runtime';
2
2
  import { reLaunch, navigateBack } from '../api.js';
3
- import { loadNavigationBarStyle } from '../style.js';
4
3
  import '../utils/index.js';
5
4
  import stacks from './stack.js';
6
5
  import { isDingTalk } from '../utils/navigate.js';
@@ -11,7 +10,6 @@ class NavigationBarHandler {
11
10
  this.cache = {};
12
11
  this.pageContext = pageContext;
13
12
  this.init();
14
- loadNavigationBarStyle();
15
13
  eventCenter.on('__taroH5SetNavigationTitle', (title) => {
16
14
  this.setTitle(title);
17
15
  });
@@ -32,19 +30,19 @@ class NavigationBarHandler {
32
30
  var _a;
33
31
  if (!this.navigationBarElement)
34
32
  return null;
35
- return (_a = this.navigationBarElement.getElementsByTagName('taro-navigation-bar-home')) === null || _a === void 0 ? void 0 : _a[0];
33
+ return (_a = this.navigationBarElement.getElementsByClassName('taro-navigation-bar-home')) === null || _a === void 0 ? void 0 : _a[0];
36
34
  }
37
35
  get backBtnElement() {
38
36
  var _a;
39
37
  if (!this.navigationBarElement)
40
38
  return null;
41
- return (_a = this.navigationBarElement.getElementsByTagName('taro-navigation-bar-back')) === null || _a === void 0 ? void 0 : _a[0];
39
+ return (_a = this.navigationBarElement.getElementsByClassName('taro-navigation-bar-back')) === null || _a === void 0 ? void 0 : _a[0];
42
40
  }
43
41
  get titleElement() {
44
42
  var _a;
45
43
  if (!this.navigationBarElement)
46
44
  return null;
47
- return (_a = this.navigationBarElement.getElementsByTagName('taro-navigation-bar-title')) === null || _a === void 0 ? void 0 : _a[0];
45
+ return (_a = this.navigationBarElement.getElementsByClassName('taro-navigation-bar-title')) === null || _a === void 0 ? void 0 : _a[0];
48
46
  }
49
47
  init() {
50
48
  var _a, _b;
@@ -55,8 +53,7 @@ class NavigationBarHandler {
55
53
  (_b = this.backBtnElement) === null || _b === void 0 ? void 0 : _b.addEventListener('click', this.backFn.bind(this));
56
54
  }
57
55
  setNavigationBarElement() {
58
- var _a;
59
- this.navigationBarElement = (_a = document.getElementsByTagName('taro-navigation-bar-wrap')) === null || _a === void 0 ? void 0 : _a[0];
56
+ this.navigationBarElement = document.getElementById('taro-navigation-bar');
60
57
  }
61
58
  load() {
62
59
  this.setCacheValue();
@@ -168,23 +165,25 @@ class NavigationBarHandler {
168
165
  fnBtnToggleToHome() {
169
166
  if (!this.navigationBarElement)
170
167
  return;
171
- this.navigationBarElement.classList.add('taro-navigation-bar-home');
172
- this.navigationBarElement.classList.remove('taro-navigation-bar-back');
168
+ this.navigationBarElement.classList.add('taro-navigation-bar-home-icon');
169
+ this.navigationBarElement.classList.remove('taro-navigation-bar-back-icon');
173
170
  }
174
171
  fnBtnToggleToBack() {
175
172
  if (!this.navigationBarElement)
176
173
  return;
177
- this.navigationBarElement.classList.remove('taro-navigation-bar-home');
178
- this.navigationBarElement.classList.add('taro-navigation-bar-back');
174
+ this.navigationBarElement.classList.remove('taro-navigation-bar-home-icon');
175
+ this.navigationBarElement.classList.add('taro-navigation-bar-back-icon');
179
176
  }
180
177
  fnBtnToggleToNone() {
181
178
  if (!this.navigationBarElement)
182
179
  return;
183
- this.navigationBarElement.classList.remove('taro-navigation-bar-home');
184
- this.navigationBarElement.classList.remove('taro-navigation-bar-back');
180
+ this.navigationBarElement.classList.remove('taro-navigation-bar-home-icon');
181
+ this.navigationBarElement.classList.remove('taro-navigation-bar-back-icon');
185
182
  }
186
183
  setNavigationBarVisible(show) {
187
184
  var _a, _b;
185
+ if (!this.navigationBarElement)
186
+ return;
188
187
  let shouldShow;
189
188
  if (typeof show === 'boolean') {
190
189
  shouldShow = show;
package/dist/router/spa.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { __awaiter } from 'tslib';
2
- import { incrementId, addLeadingSlash, eventCenter, stripBasename, Current, createPageConfig, hooks, stringify } from '@tarojs/runtime';
2
+ import { incrementId, addLeadingSlash, eventCenter, stripBasename, Current, safeExecute, createPageConfig, hooks, stringify } from '@tarojs/runtime';
3
3
  import { Action } from 'history';
4
4
  import UniversalRouter from 'universal-router';
5
5
  import { prependBasename } from '../history.js';
@@ -187,12 +187,23 @@ function createRouter(history, app, config, framework) {
187
187
  render({ location: history.location, action: Action.Push });
188
188
  (_b = app.onShow) === null || _b === void 0 ? void 0 : _b.call(app, launchParam);
189
189
  window.addEventListener('visibilitychange', () => {
190
- var _a, _b;
190
+ var _a, _b, _c, _d, _e, _f, _g;
191
+ const currentPath = ((_a = Current.page) === null || _a === void 0 ? void 0 : _a.path) || '';
192
+ const path = currentPath.substring(0, currentPath.indexOf('?'));
193
+ const param = {};
194
+ // app的 onShow/onHide 生命周期的路径信息为当前页面的路径
195
+ Object.assign(param, launchParam, { path });
191
196
  if (document.visibilityState === 'visible') {
192
- (_a = app.onShow) === null || _a === void 0 ? void 0 : _a.call(app, launchParam);
197
+ (_b = app.onShow) === null || _b === void 0 ? void 0 : _b.call(app, param);
198
+ // 单页面app显示后一刻会触发当前 page.onShow 生命周期函数
199
+ (_d = (_c = Current.page) === null || _c === void 0 ? void 0 : _c.onShow) === null || _d === void 0 ? void 0 : _d.call(_c);
193
200
  }
194
201
  else {
195
- (_b = app.onHide) === null || _b === void 0 ? void 0 : _b.call(app, launchParam);
202
+ // 单页面app隐藏前一刻会触发当前 page.onHide 生命周期函数
203
+ if ((_e = Current.page) === null || _e === void 0 ? void 0 : _e.path) {
204
+ safeExecute((_f = Current.page) === null || _f === void 0 ? void 0 : _f.path, 'onHide');
205
+ }
206
+ (_g = app.onHide) === null || _g === void 0 ? void 0 : _g.call(app, param);
196
207
  }
197
208
  });
198
209
  return history.listen(render);
package/dist/style.js CHANGED
@@ -88,21 +88,21 @@ function loadNavigationBarStyle() {
88
88
  display: none;
89
89
  }
90
90
 
91
- taro-navigation-bar-title {
91
+ .taro-navigation-bar-title {
92
92
  font-size: 24px;
93
93
  height: 24px;
94
94
  line-height: 24px;
95
95
  }
96
96
 
97
- .taro-navigation-bar-no-icon > taro-navigation-bar-home {
97
+ .taro-navigation-bar-no-icon > .taro-navigation-bar-home {
98
98
  display: none;
99
99
  }
100
100
 
101
- .taro-navigation-bar-no-icon > taro-navigation-bar-back {
101
+ .taro-navigation-bar-no-icon > .taro-navigation-bar-back {
102
102
  display: none;
103
103
  }
104
104
 
105
- .taro-navigation-bar-home > taro-navigation-bar-home {
105
+ .taro-navigation-bar-home-icon > .taro-navigation-bar-home {
106
106
  display: block;
107
107
  left: 8px;
108
108
  position: absolute;
@@ -110,15 +110,14 @@ function loadNavigationBarStyle() {
110
110
  height: 24px;
111
111
  }
112
112
 
113
- .taro-navigation-bar-back > taro-navigation-bar-back {
113
+ .taro-navigation-bar-back-icon > .taro-navigation-bar-back {
114
114
  display: block;
115
115
  left: 8px;
116
116
  position: absolute;
117
117
  width: 24px;
118
118
  height: 24px;
119
119
  }
120
-
121
- `;
120
+ `;
122
121
  addStyle(css);
123
122
  }
124
123
  function addStyle(css) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tarojs/router",
3
- "version": "3.6.24-nightly.8",
3
+ "version": "3.6.24",
4
4
  "description": "Taro-router",
5
5
  "browser": "dist/index.js",
6
6
  "main:h5": "dist/index.esm.js",
@@ -44,12 +44,12 @@
44
44
  "rollup-plugin-ts": "^3.0.2",
45
45
  "ts-jest": "^29.0.5",
46
46
  "typescript": "^4.7.4",
47
- "@tarojs/taro": "3.6.24-nightly.8",
48
- "@tarojs/runtime": "3.6.24-nightly.8"
47
+ "@tarojs/runtime": "3.6.24",
48
+ "@tarojs/taro": "3.6.24"
49
49
  },
50
50
  "peerDependencies": {
51
- "@tarojs/runtime": "3.6.24-nightly.8",
52
- "@tarojs/taro": "3.6.24-nightly.8"
51
+ "@tarojs/runtime": "3.6.24",
52
+ "@tarojs/taro": "3.6.24"
53
53
  },
54
54
  "scripts": {
55
55
  "prebuild": "pnpm run clean",