@tarojs/router 4.0.0-canary.9 → 4.0.0

package/dist/router/page.js

@@ -5,6 +5,7 @@ import { bindPageScroll } from '../events/scroll.js';
 import { setHistory, history } from '../history.js';
 import { loadAnimateStyle, loadRouterStyle } from '../style.js';
 import { routesAlias } from '../utils/index.js';
+import NavigationBarHandler from './navigation-bar.js';
 import stacks from './stack.js';
 
 /* eslint-disable dot-notation */
@@ -14,7 +15,9 @@ class PageHandler {
         this.defaultAnimation = { duration: 300, delay: 50 };
         this.config = config;
         this.homePage = getHomePage(this.routes[0].path, this.basename, this.customRoutes, this.config.entryPagePath);
+        this.originHomePage = this.config.entryPagePath || this.routes[0].path || this.basename;
         this.mount();
+        this.navigationBarHandler = new NavigationBarHandler(this);
     }
     get currentPage() {
         const routePath = getCurrentPage(this.routerMode, this.basename);
@@ -46,14 +49,14 @@ class PageHandler {
     }
     set pathname(p) { this.router.pathname = p; }
     get pathname() { return this.router.pathname; }
+    // Note: 把 pathname 转换为原始路径，主要是处理 customRoutes 和 basename
+    get originPathname() { return routesAlias.getOrigin(addLeadingSlash(stripBasename(this.pathname, this.basename))); }
     get basename() { return this.router.basename || ''; }
     get pageConfig() {
-        const routePath = addLeadingSlash(stripBasename(this.pathname, this.basename));
         const homePage = addLeadingSlash(this.homePage);
         return this.routes.find(r => {
-            var _a;
             const pagePath = addLeadingSlash(r.path);
-            return [pagePath, homePage].includes(routePath) || ((_a = routesAlias.getConfig(pagePath)) === null || _a === void 0 ? void 0 : _a.includes(routePath));
+            return [pagePath, homePage].includes(this.originPathname);
         });
     }
     isTabBar(pathname) {
@@ -120,7 +123,7 @@ class PageHandler {
         this.pathname = history.location.pathname;
         // Note: 注入页面样式
         this.animation && loadAnimateStyle(this.animationDuration);
-        loadRouterStyle(this.tabBarList.length > 1, this.usingWindowScroll);
+        loadRouterStyle(this.tabBarList.length > 1, this.usingWindowScroll, this.router.enhanceAnimation);
     }
     onReady(page, onLoad = true) {
         var _a;
@@ -158,6 +161,7 @@ class PageHandler {
             this.isDefaultNavigationStyle() && pageEl.classList.add('taro_navigation_page');
             this.addAnimation(pageEl, pageNo === 0);
             (_a = page.onShow) === null || _a === void 0 ? void 0 : _a.call(page);
+            this.navigationBarHandler.load();
             this.bindPageEvents(page, pageConfig);
             this.triggerRouterChange();
         }
@@ -170,6 +174,7 @@ class PageHandler {
                 this.isDefaultNavigationStyle() && (pageEl === null || pageEl === void 0 ? void 0 : pageEl.classList.add('taro_navigation_page'));
                 this.addAnimation(pageEl, pageNo === 0);
                 (_a = page.onShow) === null || _a === void 0 ? void 0 : _a.call(page);
+                this.navigationBarHandler.load();
                 this.onReady(page, true);
                 this.bindPageEvents(page, pageConfig);
                 this.triggerRouterChange();
@@ -224,6 +229,7 @@ class PageHandler {
             pageEl.classList.remove('taro_page_shade');
             this.addAnimation(pageEl, pageNo === 0);
             (_a = page.onShow) === null || _a === void 0 ? void 0 : _a.call(page);
+            this.navigationBarHandler.load();
             this.bindPageEvents(page, pageConfig);
             this.triggerRouterChange();
         }
@@ -233,30 +239,43 @@ class PageHandler {
                 pageEl = this.getPageContainer(page);
                 this.addAnimation(pageEl, pageNo === 0);
                 (_a = page.onShow) === null || _a === void 0 ? void 0 : _a.call(page);
+                this.navigationBarHandler.load();
                 this.onReady(page, false);
                 this.bindPageEvents(page, pageConfig);
                 this.triggerRouterChange();
             });
         }
     }
-    hide(page) {
-        var _a;
+    hide(page, animation = false) {
+        var _a, _b, _c, _d, _e, _f, _g, _h;
         if (!page)
             return;
         // NOTE: 修复多页并发问题，此处可能因为路由跳转过快，执行时页面可能还没有创建成功
         const pageEl = this.getPageContainer(page);
         if (pageEl) {
-            if (this.hideTimer) {
-                clearTimeout(this.hideTimer);
-                this.hideTimer = null;
-                pageEl.classList.add('taro_page_shade');
+            if (animation) {
+                if (this.hideTimer) {
+                    clearTimeout(this.hideTimer);
+                    this.hideTimer = null;
+                    (_c = (_b = (_a = this.lastHidePage) === null || _a === void 0 ? void 0 : _a.classList) === null || _b === void 0 ? void 0 : _b.add) === null || _c === void 0 ? void 0 : _c.call(_b, 'taro_page_shade');
+                }
+                this.lastHidePage = pageEl;
+                this.hideTimer = setTimeout(() => {
+                    this.hideTimer = null;
+                    pageEl.classList.add('taro_page_shade');
+                }, this.animationDuration + this.animationDelay);
+                (_d = page.onHide) === null || _d === void 0 ? void 0 : _d.call(page);
             }
-            this.lastHidePage = pageEl;
-            this.hideTimer = setTimeout(() => {
-                this.hideTimer = null;
+            else {
+                if (this.hideTimer) {
+                    clearTimeout(this.hideTimer);
+                    this.hideTimer = null;
+                    (_g = (_f = (_e = this.lastHidePage) === null || _e === void 0 ? void 0 : _e.classList) === null || _f === void 0 ? void 0 : _f.add) === null || _g === void 0 ? void 0 : _g.call(_f, 'taro_page_shade');
+                }
+                (_h = page.onHide) === null || _h === void 0 ? void 0 : _h.call(page);
                 pageEl.classList.add('taro_page_shade');
-            }, this.animationDuration + this.animationDelay);
-            (_a = page.onHide) === null || _a === void 0 ? void 0 : _a.call(page);
+                this.lastHidePage = pageEl;
+            }
         }
         else {
             setTimeout(() => this.hide(page), 0);

package/dist/router/spa.d.ts

@@ -1,5 +1,4 @@
-import { AppInstance } from '@tarojs/runtime';
-import { History } from "../history.js";
-import { SpaRouterConfig } from '../../types/router';
-declare function createRouter(history: History, app: AppInstance, config: SpaRouterConfig, framework?: string): () => void;
-export { createRouter };
+import type { AppInstance } from '@tarojs/runtime';
+import type { History } from 'history';
+import type { SpaRouterConfig } from '../../types/router';
+export declare function createRouter(history: History, app: AppInstance, config: SpaRouterConfig, framework?: string): () => void;

package/dist/router/spa.js

@@ -1,10 +1,9 @@
 import { __awaiter } from 'tslib';
-import { incrementId, addLeadingSlash, eventCenter, stripBasename, Current, createPageConfig, hooks, stringify } from '@tarojs/runtime';
+import { incrementId, addLeadingSlash, eventCenter, stripBasename, Current, safeExecute, createPageConfig, hooks, stringify } from '@tarojs/runtime';
 import { Action } from 'history';
 import UniversalRouter from 'universal-router';
 import { prependBasename } from '../history.js';
 import { routesAlias } from '../utils/index.js';
-import { setTitle } from '../utils/navigate.js';
 import { RouterConfig } from './index.js';
 import PageHandler from './page.js';
 import stacks from './stack.js';
@@ -18,6 +17,10 @@ function createRouter(history, app, config, framework) {
     }
     RouterConfig.config = config;
     const handler = new PageHandler(config, history);
+    // Note: 弱网情况下，快速切换 tab，会造成同个页面实例被多次挂在到页面上，原因是资源请求是异步的，短时间内发起多个请求，
+    // 会在资源加载完成后，同时走到挂载的逻辑，造成 pageStampId 更新不及时，两个 page 的Id 相同，后面很多操作是通过 getElementById 来进行的
+    // 所以需要加一个锁来应对这个情况
+    const pageLock = {};
     routesAlias.set(handler.router.customRoutes);
     const basename = handler.router.basename;
     const routes = handler.routes.map(route => {
@@ -39,29 +42,35 @@ function createRouter(history, app, config, framework) {
     eventCenter.trigger('__taroRouterLaunch', launchParam);
     (_a = app.onLaunch) === null || _a === void 0 ? void 0 : _a.call(app, launchParam);
     app.onError && window.addEventListener('error', e => { var _a; return (_a = app.onError) === null || _a === void 0 ? void 0 : _a.call(app, e.message); });
-    const render = ({ location, action }) => __awaiter(this, void 0, void 0, function* () {
-        var _c, _d, _e, _f, _g, _h, _j, _k, _l;
-        handler.pathname = decodeURI(location.pathname);
-        if ((_c = window.__taroAppConfig) === null || _c === void 0 ? void 0 : _c.usingWindowScroll)
+    const render = (_c) => __awaiter(this, [_c], void 0, function* ({ location, action }) {
+        var _d, _e, _f, _g, _h, _j, _k, _l;
+        // Note: 由于下面有异步加载操作 先不要在这里去设置 handler.pathname
+        const currentPathname = decodeURI(location.pathname);
+        if ((_d = window.__taroAppConfig) === null || _d === void 0 ? void 0 : _d.usingWindowScroll)
             window.scrollTo(0, 0);
         eventCenter.trigger('__taroRouterChange', {
             toLocation: {
-                path: handler.pathname
+                path: currentPathname
             }
         });
-        let element, params;
+        let element, context, params;
+        const routerPath = handler.router.forcePath || currentPathname;
+        pageLock[routerPath] = typeof pageLock[routerPath] === 'number' ? pageLock[routerPath] + 1 : 1;
+        const currentLock = pageLock[routerPath];
+        let postLock;
         try {
-            const result = yield router.resolve(handler.router.forcePath || handler.pathname);
-            [element, , params] = yield Promise.all(result);
+            const result = yield router.resolve(routerPath);
+            [element, context, params] = yield Promise.all(result);
+            postLock = pageLock[routerPath];
         }
         catch (error) {
             if (error.status === 404) {
                 const notFoundEvent = {
                     isEntryPage: stacks.length === 0,
-                    path: handler.pathname,
+                    path: currentPathname,
                     query: handler.getQuery(createStampId()),
                 };
-                (_d = app.onPageNotFound) === null || _d === void 0 ? void 0 : _d.call(app, notFoundEvent);
+                (_e = app.onPageNotFound) === null || _e === void 0 ? void 0 : _e.call(app, notFoundEvent);
                 eventCenter.trigger('__taroRouterNotFound', notFoundEvent);
             }
             else if (/Loading hot update .* failed./.test(error.message)) {
@@ -72,15 +81,17 @@ function createRouter(history, app, config, framework) {
                 throw error;
             }
         }
-        if (!element)
+        if (!element || currentLock !== postLock)
             return;
-        const pageConfig = handler.pageConfig;
-        let enablePullDownRefresh = ((_e = config === null || config === void 0 ? void 0 : config.window) === null || _e === void 0 ? void 0 : _e.enablePullDownRefresh) || false;
-        let navigationStyle = ((_f = config === null || config === void 0 ? void 0 : config.window) === null || _f === void 0 ? void 0 : _f.navigationStyle) || 'default';
-        let navigationBarTextStyle = ((_g = config === null || config === void 0 ? void 0 : config.window) === null || _g === void 0 ? void 0 : _g.navigationBarTextStyle) || 'white';
-        let navigationBarBackgroundColor = ((_h = config === null || config === void 0 ? void 0 : config.window) === null || _h === void 0 ? void 0 : _h.navigationBarBackgroundColor) || '#000000';
+        // Note: 异步结束后，在设置 handler.pathname
+        // context.pathname 在 universal-router 被处理过了，是发起资源请求的时候传入的 pathname，即 await router.resolve(routerPath) 这个 routerPath
+        handler.pathname = context.pathname;
+        const { pathname, pageConfig } = handler;
+        let enablePullDownRefresh = ((_f = config === null || config === void 0 ? void 0 : config.window) === null || _f === void 0 ? void 0 : _f.enablePullDownRefresh) || false;
+        let navigationStyle = ((_g = config === null || config === void 0 ? void 0 : config.window) === null || _g === void 0 ? void 0 : _g.navigationStyle) || 'default';
+        let navigationBarTextStyle = ((_h = config === null || config === void 0 ? void 0 : config.window) === null || _h === void 0 ? void 0 : _h.navigationBarTextStyle) || 'white';
+        let navigationBarBackgroundColor = ((_j = config === null || config === void 0 ? void 0 : config.window) === null || _j === void 0 ? void 0 : _j.navigationBarBackgroundColor) || '#000000';
         if (pageConfig) {
-            setTitle((_j = pageConfig.navigationBarTitleText) !== null && _j !== void 0 ? _j : document.title);
             if (typeof pageConfig.enablePullDownRefresh === 'boolean') {
                 enablePullDownRefresh = pageConfig.enablePullDownRefresh;
             }
@@ -96,7 +107,6 @@ function createRouter(history, app, config, framework) {
         }
         eventCenter.trigger('__taroSetNavigationStyle', navigationStyle, navigationBarTextStyle, navigationBarBackgroundColor);
         const currentPage = Current.page;
-        const pathname = handler.pathname;
         const methodName = (_k = stacks.method) !== null && _k !== void 0 ? _k : '';
         const cacheTabs = stacks.getTabs();
         let shouldLoad = false;
@@ -112,10 +122,11 @@ function createRouter(history, app, config, framework) {
             }
             shouldLoad = true;
         }
-        else if (currentPage && handler.isTabBar(handler.pathname)) {
+        else if (currentPage && handler.isTabBar(pathname)) {
             if (handler.isSamePage(currentPage))
                 return;
             if (handler.isTabBar(currentPage.path)) {
+                // NOTE: 从 tabBar 页面切换到 tabBar 页面
                 handler.hide(currentPage);
                 stacks.pushTab(currentPage.path.split('?')[0]);
             }
@@ -129,8 +140,8 @@ function createRouter(history, app, config, framework) {
                     handler.unload(currentPage, stacks.length, true);
                 }
             }
-            if (cacheTabs[handler.pathname]) {
-                stacks.popTab(handler.pathname);
+            if (cacheTabs[pathname]) {
+                stacks.popTab(pathname);
                 return handler.show(stacks.getItem(0), pageConfig, 0);
             }
             shouldLoad = true;
@@ -159,7 +170,7 @@ function createRouter(history, app, config, framework) {
             shouldLoad = true;
         }
         else if (action === 'PUSH') {
-            handler.hide(currentPage);
+            handler.hide(currentPage, true);
             shouldLoad = true;
         }
         if (shouldLoad || stacks.length < 1) {
@@ -188,6 +199,26 @@ function createRouter(history, app, config, framework) {
     }
     render({ location: history.location, action: Action.Push });
     (_b = app.onShow) === null || _b === void 0 ? void 0 : _b.call(app, launchParam);
+    window.addEventListener('visibilitychange', () => {
+        var _a, _b, _c, _d, _e, _f, _g;
+        const currentPath = ((_a = Current.page) === null || _a === void 0 ? void 0 : _a.path) || '';
+        const path = currentPath.substring(0, currentPath.indexOf('?'));
+        const param = {};
+        // app的 onShow/onHide 生命周期的路径信息为当前页面的路径
+        Object.assign(param, launchParam, { path });
+        if (document.visibilityState === 'visible') {
+            (_b = app.onShow) === null || _b === void 0 ? void 0 : _b.call(app, param);
+            // 单页面app显示后一刻会触发当前 page.onShow 生命周期函数
+            (_d = (_c = Current.page) === null || _c === void 0 ? void 0 : _c.onShow) === null || _d === void 0 ? void 0 : _d.call(_c);
+        }
+        else {
+            // 单页面app隐藏前一刻会触发当前 page.onHide 生命周期函数
+            if ((_e = Current.page) === null || _e === void 0 ? void 0 : _e.path) {
+                safeExecute((_f = Current.page) === null || _f === void 0 ? void 0 : _f.path, 'onHide');
+            }
+            (_g = app.onHide) === null || _g === void 0 ? void 0 : _g.call(app, param);
+        }
+    });
     return history.listen(render);
 }
 

package/dist/router/stack.d.ts

@@ -1,4 +1,4 @@
-import { PageInstance } from '@tarojs/runtime';
+import type { PageInstance } from '@tarojs/runtime';
 declare class Stacks {
     stacks: PageInstance[];
     backDelta: number;
@@ -23,4 +23,4 @@ declare class Stacks {
     removeTab(path: string): void;
 }
 declare const stacks: Stacks;
-export { stacks as default };
+export default stacks;

package/dist/style.d.ts

@@ -1,10 +1,13 @@
 /**
  * 插入页面动画需要的样式
  */
-declare function loadAnimateStyle(ms?: number): void;
+export declare function loadAnimateStyle(ms?: number): void;
 /**
  * 插入路由相关样式
  */
-declare function loadRouterStyle(enableTabBar: boolean, enableWindowScroll: boolean): void;
-declare function addStyle(css: any): void;
-export { loadAnimateStyle, loadRouterStyle, addStyle };
+export declare function loadRouterStyle(enableTabBar: boolean, enableWindowScroll: boolean, enhanceAnimation?: boolean): void;
+/**
+ * 插入导航栏相关的样式
+*/
+export declare function loadNavigationBarStyle(): void;
+export declare function addStyle(css: any): void;

package/dist/style.js

@@ -3,6 +3,10 @@
  */
 function loadAnimateStyle(ms = 300) {
     const css = `
+body {
+  /* 防止 iOS 页面滚动 */
+  overflow: hidden;
+}
 .taro_router > .taro_page {
   position: absolute;
   left: 0;
@@ -18,6 +22,7 @@ function loadAnimateStyle(ms = 300) {
 .taro_router > .taro_page.taro_tabbar_page,
 .taro_router > .taro_page.taro_page_show.taro_page_stationed {
   transform: none;
+  transition: none;
 }
 
 .taro_router > .taro_page.taro_page_show {
@@ -29,7 +34,7 @@ function loadAnimateStyle(ms = 300) {
 /**
  * 插入路由相关样式
  */
-function loadRouterStyle(enableTabBar, enableWindowScroll) {
+function loadRouterStyle(enableTabBar, enableWindowScroll, enhanceAnimation) {
     const css = `
   .taro_router {
     position: relative;
@@ -57,9 +62,104 @@ ${enableTabBar ? `
   }
 
 ` : ''}
-  .taro_page_shade,
+${enhanceAnimation
+        ? `.taro_page_shade:has(+.taro_page_stationed),
+  .taro_page_shade.taro_tabbar_page,
+  .taro_router > .taro_page.taro_page_show.taro_page_stationed:not(.taro_page_shade):not(.taro_tabbar_page):not(:last-child):has(+.taro_page_stationed) {
+    display: none;
+  }` : ` .taro_page_shade,
   .taro_router > .taro_page.taro_page_show.taro_page_stationed:not(.taro_page_shade):not(.taro_tabbar_page):not(:last-child) {
     display: none;
+  }`} 
+`;
+    addStyle(css);
+}
+/**
+ * 插入导航栏相关的样式
+*/
+function loadNavigationBarStyle() {
+    const css = `
+  .taro-navigation-bar-show {
+    display: flex;
+    background: white;
+    position: sticky;
+    z-index: 500;
+    top: 0;
+    padding-bottom: 8px;
+    padding-top: calc(env(safe-area-inset-top) + 8px);
+    justify-content: center;
+    align-items: center;
+  }
+
+  .taro-navigation-bar-hide {
+    display: none;
+  }
+
+  .taro-navigation-bar-title-wrap {
+    display: flex;
+    height: 24px;
+  }
+
+  .taro-navigation-bar-title-wrap > .taro-navigation-bar-loading {
+    display: none;
+    animation: loading 2s linear infinite;
+  }
+
+  .taro-navigation-bar-title-wrap .taro-navigation-bar-loading.taro-navigation-bar-loading-show {
+    display: flex;
+  }
+
+  .taro-navigation-bar-title-wrap > .taro-navigation-bar-title {
+    font-size: 24px;
+    height: 24px;
+    line-height: 24px;
+    max-width: 100px;
+    white-space: nowrap;
+    overflow: hidden;
+    line-height: 24px;
+    text-overflow: ellipsis;
+  }
+
+  @keyframes loading {
+    from {
+      transform: rotate(0deg);
+    }
+    to {
+      transform: rotate(360deg);
+    }
+  }
+
+  @keyframes loading {
+    from {
+      transform: rotate(0deg);
+    }
+    to {
+      transform: rotate(360deg);
+    }
+  }
+
+  .taro-navigation-bar-no-icon > .taro-navigation-bar-home {
+    display: none;
+  }
+
+  .taro-navigation-bar-no-icon > .taro-navigation-bar-back {
+    display: none;
+  }
+
+  .taro-navigation-bar-home-icon > .taro-navigation-bar-home {
+    display: flex;
+    left: 8px;
+    position: absolute;
+    width: 24px;
+    height: 24px;
+  }
+
+  .taro-navigation-bar-back-icon > .taro-navigation-bar-back {
+    display: flex;
+    left: 8px;
+    position: absolute;
+    width: 24px;
+    height: 24px;
   }
 `;
     addStyle(css);
@@ -72,4 +172,4 @@ function addStyle(css) {
     document.getElementsByTagName('head')[0].appendChild(style);
 }
 
-export { addStyle, loadAnimateStyle, loadRouterStyle };
+export { addStyle, loadAnimateStyle, loadNavigationBarStyle, loadRouterStyle };

package/dist/tabbar.d.ts

@@ -1,4 +1,3 @@
 import { AppConfig } from '@tarojs/taro';
-import { History } from "./history.js";
-declare function initTabbar(config: AppConfig, history: History): void;
-export { initTabbar };
+import type { History } from 'history';
+export declare function initTabbar(config: AppConfig, history: History): void;

package/dist/utils/index.d.ts

@@ -6,6 +6,5 @@ declare class RoutesAlias {
     getAlias: (url?: string) => string;
     getAll: (url?: string) => string[];
 }
-declare const routesAlias: RoutesAlias;
-export { routesAlias };
-export * from "./navigate.js";
+export declare const routesAlias: RoutesAlias;
+export * from './navigate';

package/dist/utils/index.js

@@ -1,5 +1,4 @@
 import { addLeadingSlash } from '@tarojs/runtime';
-import 'tslib';
 
 class RoutesAlias {
     constructor() {

package/dist/utils/navigate.d.ts

@@ -1,4 +1,9 @@
-declare const isWeixin: () => boolean;
-declare const isDingTalk: () => boolean;
-declare function setTitle(title: string): Promise<string>;
-export { isWeixin, isDingTalk, setTitle };
+export declare const isWeixin: () => boolean;
+export declare const isDingTalk: () => boolean;
+export declare function setMpaTitle(title: string): void;
+export declare function setTitle(title: string): void;
+export declare function setNavigationBarStyle(option: {
+    backgroundColor: string;
+    frontColor: string;
+}): void;
+export declare function setNavigationBarLoading(loading: boolean): void;

package/dist/utils/navigate.js

@@ -1,25 +1,31 @@
-import { __awaiter } from 'tslib';
+import { eventCenter } from '@tarojs/runtime';
 
-let preTitle = document.title;
-let isLoadDdEntry = false;
 const isWeixin = () => !!navigator.userAgent.match(/\bMicroMessenger\b/ig);
 const isDingTalk = () => !!navigator.userAgent.match(/\bDingTalk\b/ig);
-function setTitle(title) {
-    return __awaiter(this, void 0, void 0, function* () {
-        if (preTitle === title)
-            return title;
-        document.title = title;
-        preTitle = title;
-        if (process.env.SUPPORT_DINGTALK_NAVIGATE !== 'disabled' && isDingTalk()) {
-            if (!isLoadDdEntry) {
-                isLoadDdEntry = true;
-                require('dingtalk-jsapi/platform');
-            }
-            const setDingTitle = require('dingtalk-jsapi/api/biz/navigation/setTitle').default;
-            setDingTitle({ title });
+let preTitle = document.title;
+let isLoadDdEntry = false;
+function setMpaTitle(title) {
+    if (preTitle === title)
+        return;
+    document.title = title;
+    preTitle = title;
+    if (process.env.SUPPORT_DINGTALK_NAVIGATE !== 'disabled' && isDingTalk()) {
+        if (!isLoadDdEntry) {
+            isLoadDdEntry = true;
+            require('dingtalk-jsapi/platform');
         }
-        return title;
-    });
+        const setDingTitle = require('dingtalk-jsapi/api/biz/navigation/setTitle').default;
+        setDingTitle({ title });
+    }
+}
+function setTitle(title) {
+    eventCenter.trigger('__taroH5SetNavigationBarTitle', title);
+}
+function setNavigationBarStyle(option) {
+    eventCenter.trigger('__taroH5setNavigationBarColor', option);
+}
+function setNavigationBarLoading(loading) {
+    eventCenter.trigger('__taroH5setNavigationBarLoading', loading);
 }
 
-export { isDingTalk, isWeixin, setTitle };
+export { isDingTalk, isWeixin, setMpaTitle, setNavigationBarLoading, setNavigationBarStyle, setTitle };

package/package.json

@@ -1,7 +1,9 @@
 {
   "name": "@tarojs/router",
-  "version": "4.0.0-canary.9",
+  "version": "4.0.0",
   "description": "Taro-router",
+  "author": "O2Team",
+  "license": "MIT",
   "browser": "dist/index.js",
   "main:h5": "dist/index.esm.js",
   "main": "dist/index.js",
@@ -20,45 +22,34 @@
   "keywords": [
     "router"
   ],
-  "author": "O2Team",
-  "license": "MIT",
+  "engines": {
+    "node": ">= 18"
+  },
   "dependencies": {
     "dingtalk-jsapi": "~2.15.2",
-    "history": "^5.1.0",
+    "history": "^5.3.0",
     "mobile-detect": "^1.4.2",
-    "query-string": "^7.1.1",
+    "query-string": "^9.0.0",
     "tslib": "^2.6.2",
-    "universal-router": "^8.3.0"
+    "universal-router": "^9.2.0"
   },
   "devDependencies": {
-    "@rollup/plugin-commonjs": "^25.0.7",
-    "@rollup/plugin-node-resolve": "^15.2.3",
-    "@rollup/plugin-typescript": "^11.1.0",
-    "@types/jest": "^29.4.0",
-    "jest": "^29.3.1",
-    "jest-cli": "^29.3.1",
-    "jest-environment-jsdom": "^29.6.4",
-    "jsdom": "^21.1.0",
-    "rollup": "^3.8.1",
-    "rollup-plugin-node-externals": "^5.0.0",
-    "rollup-plugin-ts": "^3.0.2",
-    "ts-jest": "^29.0.5",
-    "typescript": "^4.7.4",
-    "@tarojs/runtime": "4.0.0-canary.9",
-    "@tarojs/taro": "4.0.0-canary.9"
+    "@tarojs/components": "4.0.0",
+    "@tarojs/taro": "4.0.0",
+    "@tarojs/shared": "4.0.0",
+    "@tarojs/runtime": "4.0.0"
   },
   "peerDependencies": {
-    "@tarojs/runtime": "4.0.0-canary.9",
-    "@tarojs/taro": "4.0.0-canary.9"
+    "@tarojs/runtime": "4.0.0",
+    "@tarojs/taro": "4.0.0",
+    "@tarojs/shared": "4.0.0"
   },
   "scripts": {
+    "prod": "pnpm run build",
     "prebuild": "pnpm run clean",
     "build": "pnpm run rollup --environment NODE_ENV:production",
     "clean": "rimraf --impl=move-remove ./dist",
     "dev": "pnpm run rollup --environment NODE_ENV:development -w",
-    "rollup": "rollup --config rollup.config.ts --configPlugin @rollup/plugin-typescript --bundleConfigAsCjs",
-    "test": "cross-env NODE_ENV=jest jest",
-    "test:ci": "cross-env NODE_ENV=jest jest --ci -i --coverage --silent",
-    "test:dev": "cross-env NODE_ENV=jest jest --watch"
+    "rollup": "rollup --config rollup.config.mts --configPlugin typescript"
   }
 }

package/types/api.d.ts

@@ -11,3 +11,8 @@ export interface Option extends Base {
 export interface NavigateBackOption extends Base {
   delta: number
 }
+
+ export interface NavigateOption extends BaseOption {
+  url: string
+  events?: Record<string, any>
+}

package/types/router.d.ts

@@ -12,6 +12,8 @@ export interface Router {
   customRoutes?: Record<string, string | string[]>
   pathname: string
   forcePath?: string
+  /** 加上这个参数，可以解决返回页面的时候白屏的问题，但是某些不支持 :has() 选择器的浏览器会有问题 */
+  enhanceAnimation?: boolean
 }
 
 export interface SpaRouterConfig extends AppConfig {