fix: 解决页面切换的问题

* 解决pageNo===0时，即打开第1个页面时在鸿蒙平台动画不能真正的停止的问题 * 解决返回时上一个页面瞬间白屏的问题
NervJS · Apr 3, 2024 · 3617d2b · 3617d2b
1 parent 0b91df9
commit 3617d2b
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 0 deletions.
diff --git a/packages/taro-router/src/router/page.ts b/packages/taro-router/src/router/page.ts
@@ -218,6 +218,8 @@ export default class PageHandler {
         pageEl.style.zIndex = '1'
       }
 
+      eventCenter.trigger('__taroPageWillShowAfterDestroyed')
+
       this.unloadTimer = setTimeout(() => {
         this.unloadTimer = null
         this.lastUnloadPage?.onUnload?.()
@@ -235,6 +237,14 @@ export default class PageHandler {
     if (delta >= 1) this.unload(stacks.last, delta)
   }
 
+  willShow (page?: PageInstance | null) {
+    if (!page) return
+    const pageEl = this.getPageContainer(page)
+    if (pageEl) {
+      pageEl.classList.remove('taro_page_shade')
+    }
+  }
+
   show (page?: PageInstance | null, pageConfig: Route = {}, pageNo = 0) {
     if (!page) return
 

diff --git a/packages/taro-router/src/router/spa.ts b/packages/taro-router/src/router/spa.ts
@@ -155,6 +155,12 @@ export function createRouter (
       const delta = stacks.getDelta(pathname)
       // NOTE: Safari 内核浏览器在非应用页面返回上一页时，会触发额外的 POP 事件，此处需避免当前页面被错误卸载
       if (currentPage !== stacks.getItem(prevIndex)) {
+        eventCenter.once('__taroPageWillShowAfterDestroyed', () => {
+          if (prevIndex > -1) {
+            const pageInstance = stacks.getItem(prevIndex)
+            pageInstance && handler.willShow(pageInstance)
+          }
+        })
         handler.unload(currentPage, delta, prevIndex > -1)
         if (prevIndex > -1) {
           eventCenter.once('__taroPageOnShowAfterDestroyed', () => {

diff --git a/packages/taro-router/src/style.ts b/packages/taro-router/src/style.ts
@@ -21,6 +21,7 @@ body {
 .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 {