NervJS · SyMind · Feb 19, 2021 · Mar 2, 2021 · Mar 5, 2021 · Mar 12, 2021
diff --git a/packages/taro-cli/templates/default/src/index.html b/packages/taro-cli/templates/default/src/index.html
@@ -10,7 +10,7 @@
   <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" >
   <title></title>
   <script>
-    !function(x){function w(){var v,u,t,tes,s=x.document,r=s.documentElement,a=r.getBoundingClientRect().width;if(!v&&!u){var n=!!x.navigator.appVersion.match(/AppleWebKit.*Mobile.*/);v=x.devicePixelRatio;tes=x.devicePixelRatio;v=n?v:1,u=1/v}if(a>=640){r.style.fontSize="40px"}else{if(a<=320){r.style.fontSize="20px"}else{r.style.fontSize=a/320*20+"px"}}}x.addEventListener("resize",function(){w()});w()}(window);
+    !function(n){function e(){var e=n.document.documentElement,t=e.getBoundingClientRect().width;e.style.fontSize=t>=640?"40px":t<=320?"20px":t/320*20+"px"}n.addEventListener("resize",(function(){e()})),e()}(window);
   </script>
 </head>
 <body>

diff --git a/packages/taro-components/src/components/pull-down-refresh/pull-to-refresh.tsx b/packages/taro-components/src/components/pull-down-refresh/pull-to-refresh.tsx
@@ -55,15 +55,8 @@ export class PullToRefresh implements ComponentInterface {
   private _lastScreenY = 0;
 
   private _isMounted = false;
-
   private get scrollContainer () {
-    if (document.querySelector('.taro-tabbar__tabbar') === null) {
-      // 没设置tabbar
-      return window
-    } else {
-      // 有设置tabbar
-      return document.querySelector('.taro-tabbar__panel') || window
-    }
+    return window
   }
 
   @Watch('currSt')
@@ -153,12 +146,6 @@ export class PullToRefresh implements ComponentInterface {
   }
 
   isEdge = (ele: HTMLElement) => {
-    const container = this.scrollContainer
-    if (container && container === document.body) {
-      // In chrome61 `document.body.scrollTop` is invalid
-      const scrollNode = document.scrollingElement ? document.scrollingElement : document.body
-      return scrollNode.scrollTop <= 0
-    }
     return ele.scrollTop <= 0
   }
 

diff --git a/packages/taro-components/src/components/tabbar/style/index.scss b/packages/taro-components/src/components/tabbar/style/index.scss
@@ -12,22 +12,19 @@ html, body {
       }
     }
   }
-  &__container {
-    display: flex;
-    height: 100%;
-    flex-direction: column;
-    overflow: hidden;
-  }
   &__panel {
-    flex: 1;
-    position: relative;
-    overflow: auto;
-    -webkit-overflow-scrolling: touch;
+    &-bottom {
+      padding-bottom: 50px;
+    }
+    &-top {
+      padding-top: 50px;
+    }
   }
   &__tabbar {
-    position: relative;
+    position: fixed;
+    left: 0;
+    right: 0;
     height: 50px;
-    width: 100%;
     transition: bottom .2s, top .2s;
     &-top {
       top: 0;
@@ -40,7 +37,6 @@ html, body {
     }
     &-slideout {
       top: -52px;
-      flex: 0 0;
     }
   }
 

diff --git a/packages/taro-h5/src/api/scroll/index.js b/packages/taro-h5/src/api/scroll/index.js
@@ -25,31 +25,12 @@ export const pageScrollTo = ({ scrollTop, selector, duration = 300, success, fai
         throw Error('"scrollTop" 或 "selector" 需要其之一')
       }
 
-      let el
-      if (document.querySelector('.taro-tabbar__tabbar') === null) {
-        // 没设置tabbar
-        el = window
-      } else {
-        // 有设置tabbar
-        el = document.querySelector('.taro-tabbar__panel') || window
-      }
-
       if (!scrollFunc) {
-        if (el === window) {
-          scrollFunc = pos => {
-            if (pos === undefined) {
-              return window.pageYOffset
-            } else {
-              window.scrollTo(0, pos)
-            }
-          }
-        } else {
-          scrollFunc = pos => {
-            if (pos === undefined) {
-              return el.scrollTop
-            } else {
-              el.scrollTop = pos
-            }
+        scrollFunc = pos => {
+          if (pos === undefined) {
+            return window.pageYOffset
+          } else {
+            window.scrollTo(0, pos)
           }
         }
       }

diff --git a/packages/taro-router/src/init.ts b/packages/taro-router/src/init.ts
@@ -10,10 +10,6 @@ export function init (config: RouterConfig) {
   Object.assign(routerConfig, config)
   document.getElementById('app')?.remove()
 
-  const container = document.createElement('div')
-  container.classList.add('taro-tabbar__container')
-  container.id = 'container'
-
   const panel = document.createElement('div')
   panel.classList.add('taro-tabbar__panel')
 
@@ -22,9 +18,7 @@ export function init (config: RouterConfig) {
   app.classList.add('taro_router')
 
   panel.appendChild(app)
-  container.appendChild(panel)
-
-  document.body.appendChild(container)
+  document.body.appendChild(panel)
 
-  initTabbar(config)
+  initTabbar(config, panel)
 }
diff --git a/packages/taro-router/src/scroll.ts b/packages/taro-router/src/scroll.ts
@@ -43,14 +43,8 @@ window.addEventListener('DOMSubtreeModified', (e) => {
   }
 }, false)
 
-function getScrollContainer (): Element | Window {
-  if (document.querySelector('.taro-tabbar__tabbar') === null) {
-    // 没设置tabbar
-    return window
-  } else {
-    // 有设置tabbar
-    return document.querySelector('.taro-tabbar__panel') || window
-  }
+function getScrollContainer (): Window {
+  return window
 }
 
 function getOffset () {

diff --git a/packages/taro-router/src/tabbar.ts b/packages/taro-router/src/tabbar.ts
@@ -1,11 +1,22 @@
-import { AppConfig } from '@tarojs/taro'
+import Taro, { AppConfig } from '@tarojs/taro'
 import { history } from './history'
 
-export function initTabbar (config: AppConfig) {
+export function initTabbar (config: AppConfig, panel: HTMLElement) {
   if (config.tabBar == null) {
     return
   }
 
+  const position = config.tabBar.position || 'bottom'
+  const targetClass = position === 'bottom' ? 'taro-tabbar__panel-bottom' : 'taro-tabbar__panel-top'
+  panel.classList.add(targetClass)
+
+  Taro.eventCenter.on('__taroShowTabBar', () => {
+    panel.classList.add(targetClass)
+  })
+  Taro.eventCenter.on('__taroHideTabBar', () => {
+    panel.classList.remove(targetClass)
+  })
+
   // TODO: 找到 tabbar 的类型
   const tabbar = document.createElement('taro-tabbar') as any
   const homePage = config.pages ? config.pages[0] : ''
@@ -21,7 +32,7 @@ export function initTabbar (config: AppConfig) {
     tabbar.conf.custom = false
     tabbar.conf.customRoutes = {}
   }
-  const container = document.getElementById('container')
+  const container = document.body
   // eslint-disable-next-line no-unused-expressions
   container?.appendChild(tabbar)
 }