diff --git a/packages/shared/src/runtime-hooks.ts b/packages/shared/src/runtime-hooks.ts
index 0a6fcd61375..018fcf79040 100644
--- a/packages/shared/src/runtime-hooks.ts
+++ b/packages/shared/src/runtime-hooks.ts
@@ -210,6 +210,10 @@ type ITaroHooks = {
    * 修改 Taro DOM 序列化数据
    **/
   modifyHydrateData:(data: Record<string, any>) => void
+  /**
+   * 自定义处理 Taro DOM 序列化数据，如使其脱离 data 树
+   */
+  transferHydrateData: (data: Record<string, any>, element, componentsAlias: Record<string, any>) => void
   /**
     * @todo: multi
     * 修改 Taro DOM 序列化数据
@@ -295,6 +299,8 @@ export const hooks = new TaroHooks<ITaroHooks>({
 
   modifyHydrateData: TaroHook(HOOK_TYPE.SINGLE),
 
+  transferHydrateData: TaroHook(HOOK_TYPE.SINGLE),
+
   modifySetAttrPayload: TaroHook(HOOK_TYPE.SINGLE),
 
   modifyRmAttrPayload: TaroHook(HOOK_TYPE.SINGLE),
diff --git a/packages/shared/src/template.ts b/packages/shared/src/template.ts
index 30975bb57f9..ad8f59a1bed 100644
--- a/packages/shared/src/template.ts
+++ b/packages/shared/src/template.ts
@@ -492,7 +492,7 @@ export class BaseTemplate {
     return ''
   }
 
-  public buildPageTemplate = (baseTempPath: string) => {
+  public buildPageTemplate = (baseTempPath: string, _page: { content: Record<string, any>, path: string }) => {
     const template = `<import src="${baseTempPath}"/>
 <template is="taro_tmpl" data="{{${this.dataKeymap('root:root')}}}" />`
 
diff --git a/packages/taro-alipay/src/components-react.ts b/packages/taro-alipay/src/components-react.ts
index c9844fb8d3c..99dba0807f5 100644
--- a/packages/taro-alipay/src/components-react.ts
+++ b/packages/taro-alipay/src/components-react.ts
@@ -8,3 +8,4 @@ export const ArCamera = 'ar-camera'
 export const PageContainer = 'page-container'
 export const ShareElement = 'share-element'
 export const RootPortal = 'root-portal'
+export const PageMeta = 'page-meta'
diff --git a/packages/taro-alipay/src/components.ts b/packages/taro-alipay/src/components.ts
index 4a9d704dd40..07243a5c719 100644
--- a/packages/taro-alipay/src/components.ts
+++ b/packages/taro-alipay/src/components.ts
@@ -189,5 +189,17 @@ export const components = {
   },
   RootPortal: {
     enable: 'true'
-  }
+  },
+  PageMeta: {
+    'background-color': '',
+    'background-color-top': '',
+    'background-color-bottom': '',
+    'root-background-color': '',
+    'scroll-top': "''",
+    'scroll-duration': '300',
+    'page-style': "''",
+    'root-font-size': "''",
+    'page-font-size': "''",
+    bindScroll: '',
+  },
 }
diff --git a/packages/taro-alipay/src/index.ts b/packages/taro-alipay/src/index.ts
index cfb426f8b2e..e1e5fe477ed 100644
--- a/packages/taro-alipay/src/index.ts
+++ b/packages/taro-alipay/src/index.ts
@@ -79,7 +79,9 @@ function modifyPageTemplate (ctx: IPluginContext) {
         return ''
       })
       const main = baseXml.replace(/<import-sjs name="xs" from="(.*)utils.sjs" \/>/, function () {
-        return `<import-sjs name="xs" from="${relativePath}utils.sjs" />`
+        return src.includes('<import-sjs name="xs"')
+          ? ''
+          : `<import-sjs name="xs" from="${relativePath}utils.sjs" />`
       })
 
       const res = `${templateCaller}
diff --git a/packages/taro-alipay/src/runtime-utils.ts b/packages/taro-alipay/src/runtime-utils.ts
index 7c552aa2044..da94fe2a920 100644
--- a/packages/taro-alipay/src/runtime-utils.ts
+++ b/packages/taro-alipay/src/runtime-utils.ts
@@ -1,3 +1,4 @@
+import { Shortcuts, toCamelCase } from '@tarojs/shared'
 
 import {
   handleSyncApis,
@@ -8,6 +9,7 @@ import {
   transformMeta
 } from './apis'
 
+declare const getCurrentPages: any
 declare const my: any
 
 const BUBBLE_EVENTS = new Set([
@@ -49,5 +51,19 @@ export const hostConfig = {
   },
   isBubbleEvents (eventName) {
     return BUBBLE_EVENTS.has(eventName)
-  }
+  },
+  transferHydrateData (data, element, componentsAlias) {
+    if (element.isTransferElement) {
+      const page = getCurrentPages()[0]
+      data[Shortcuts.NodeName] = element.dataName
+      page.setData({
+        [toCamelCase(data.nn)]: data
+      })
+      return {
+        sid: element.sid,
+        [Shortcuts.Text]: '',
+        [Shortcuts.NodeName]: componentsAlias['#text']?._num || '8'
+      }
+    }
+  },
 }
diff --git a/packages/taro-alipay/src/template.ts b/packages/taro-alipay/src/template.ts
index ef2cf059fb3..dbfc75e3b3f 100644
--- a/packages/taro-alipay/src/template.ts
+++ b/packages/taro-alipay/src/template.ts
@@ -16,6 +16,8 @@ export class Template extends RecursiveTemplate {
     type: 'alipay'
   }
 
+  transferComponents: Record<string, Record<string, string>> = {}
+
   buildXsTemplate () {
     return '<import-sjs name="xs" from="./utils.sjs" />'
   }
@@ -65,6 +67,10 @@ export class Template extends RecursiveTemplate {
     delete result['slot-view']
     delete result['native-slot']
 
+    // PageMeta & NavigationBar
+    this.transferComponents['page-meta'] = result['page-meta']
+    delete result['page-meta']
+
     return result
   }
 
@@ -124,4 +130,28 @@ export class Template extends RecursiveTemplate {
     return l.filter(function (i) {return i.nn === '${swiperItemAlias}'})
   }`
   }
+
+  buildPageTemplate = (baseTempPath: string, page) => {
+    let pageMetaTemplate = ''
+    const pageConfig = page?.content
+
+    if (pageConfig?.enablePageMeta) {
+      const getComponentAttrs = (componentName: string, dataPath: string) => {
+        return Object.entries(this.transferComponents[componentName]).reduce((sum, [key, value]) => {
+          sum +=`${key}="${value === 'eh' ? value : `{{${value.replace('i.', dataPath)}}}`}" `
+          return sum
+        }, '')
+      }
+      const pageMetaAttrs = getComponentAttrs('page-meta', 'pageMeta.')
+
+      pageMetaTemplate = `
+<import-sjs name="xs" from="${baseTempPath.replace('base.axml', 'utils.sjs')}" />
+<page-meta data-sid="{{pageMeta.sid}}" ${pageMetaAttrs}></page-meta>`
+    }
+
+    const template = `<import src="${baseTempPath}"/>${pageMetaTemplate}
+<template is="taro_tmpl" data="{{${this.dataKeymap('root:root')}}}" />`
+
+    return template
+  }
 }
diff --git a/packages/taro-components/types/NavigationBar.d.ts b/packages/taro-components/types/NavigationBar.d.ts
index bbf090a6a76..a2a1c575a9b 100644
--- a/packages/taro-components/types/NavigationBar.d.ts
+++ b/packages/taro-components/types/NavigationBar.d.ts
@@ -30,6 +30,12 @@ interface NavigationBarProps extends StandardProps {
 }
 /** 页面导航条配置节点，用于指定导航栏的一些属性。只能是 PageMeta 组件内的第一个节点，需要配合它一同使用。
  * 通过这个节点可以获得类似于调用 Taro.setNavigationBarTitle Taro.setNavigationBarColor 等接口调用的效果。
+ *
+ * :::info
+ * Taro v3.6.19 开始支持
+ * 需要配合 PageMeta 组件使用
+ * :::
+ *
  * @classification navig
  * @supported weapp, harmony
  * @see https://developers.weixin.qq.com/miniprogram/dev/component/navigation-bar.html
diff --git a/packages/taro-components/types/PageMeta.d.ts b/packages/taro-components/types/PageMeta.d.ts
index 53bfe00208a..7f5fda6cb08 100644
--- a/packages/taro-components/types/PageMeta.d.ts
+++ b/packages/taro-components/types/PageMeta.d.ts
@@ -80,7 +80,47 @@ declare namespace PageMetaProps {
 }
 /** 页面属性配置节点，用于指定页面的一些属性、监听页面事件。只能是页面内的第一个节点。可以配合 navigation-bar 组件一同使用。
  * 通过这个节点可以获得类似于调用 Taro.setBackgroundTextStyle Taro.setBackgroundColor 等接口调用的效果。
+ *
+ * :::info
+ * Taro v3.6.19 开始支持
+ * 开发者需要在页面配置里添加：`enablePageMeta: true`
+ * :::
+ *
  * @supported weapp, alipay
+ * @example_react
+ * ```tsx
+ * // page.config.ts
+ * export default definePageConfig({ enablePageMeta: true, ... })
+ *
+ * // page.tsx
+ * function Index () {
+ *   return (
+ *     <View>
+ *      <PageMeta
+ *        pageStyle={myPageStyle}
+ *        onScroll={handleScroll}
+ *      >
+ *        <NavigationBar title={title} />
+ *      </PageMeta>
+ *    </View>
+ *   )
+ * }
+ * ```
+ * @example_vue
+ * ```html
+ * <!-- page.config.ts -->
+ * <!-- export default definePageConfig({ enablePageMeta: true, ... }) -->
+ *
+ * <!-- page.vue -->
+ * <template>
+ *   <page-meta
+ *     :page-style="myPageStyle"
+ *     @scroll="handleScroll"
+ *   >
+ *     <navigation-bar :title="title" />
+ *   </page-meta>
+ * </template>
+ * ```
  * @see https://developers.weixin.qq.com/miniprogram/dev/component/page-meta.html
  */
 declare const PageMeta: ComponentType<PageMetaProps>
diff --git a/packages/taro-mini-runner/src/__tests__/__snapshots__/alipay.spec.ts.snap b/packages/taro-mini-runner/src/__tests__/__snapshots__/alipay.spec.ts.snap
index 6483ab2c0a9..b11b9ec8a39 100644
--- a/packages/taro-mini-runner/src/__tests__/__snapshots__/alipay.spec.ts.snap
+++ b/packages/taro-mini-runner/src/__tests__/__snapshots__/alipay.spec.ts.snap
@@ -70,10 +70,32 @@ require("./taro");
         function useTabItemTap() {}
         function useScope() {}
     },
-    12: function(module, __webpack_exports__, __webpack_require__) {
+    10: function(module, __webpack_exports__, __webpack_require__) {
+        "use strict";
+        __webpack_require__.d(__webpack_exports__, "a", (function() {
+            return _defineProperty;
+        }));
+        var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(9);
+        function _defineProperty(obj, key, value) {
+            key = Object(_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["a"])(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
+    },
+    14: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         (function(navigator) {
-            var _tarojs_shared__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(0);
+            var _babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(10);
+            var _tarojs_shared__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(0);
             var needPromiseApis = new Set([ "addCardAuth", "getOpenUserInfo", "chooseAlipayContact", "chooseCity", "chooseContact", "choosePhoneContact", "datePicker", "getAddress", "getAuthCode", "getPhoneNumber", "getRunData", "getRunScene", "getServerTime", "getTitleColor", "rsa", "paySignCenter", "tradePay", "isCollected", "multiLevelSelect", "onLocatedComplete", "optionsSelect", "prompt", "regionPicker", "setLocatedCity", "showAuthGuide", "textRiskIdentification", "vibrate", "watchShake", "connectBLEDevice", "disconnectBLEDevice", "makeBluetoothPair", "writeBLECharacteristicValue", "readBLECharacteristicValue", "notifyBLECharacteristicValueChange", "getBLEDeviceServices", "getBLEDeviceCharacteristics", "openBluetoothAdapter", "closeBluetoothAdapter", "getBluetoothAdapterState", "startBluetoothDevicesDiscovery", "stopBluetoothDevicesDiscovery", "getBluetoothDevices", "getConnectedBluetoothDevices" ]);
             var apiDiff = {
                 login: {
@@ -563,7 +585,7 @@ require("./taro");
                 }));
             }
             function initNativeApi(taro) {
-                Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["e"])(taro, my, {
+                Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["e"])(taro, my, {
                     needPromiseApis: needPromiseApis,
                     handleSyncApis: handleSyncApis,
                     transformMeta: transformMeta,
@@ -630,7 +652,7 @@ require("./taro");
                 Slider: {
                     "track-size": "4",
                     "handle-size": "22",
-                    "handle-color": Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["singleQuote"])("#ffffff")
+                    "handle-color": Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["singleQuote"])("#ffffff")
                 },
                 Switch: {
                     controlled: "false"
@@ -659,23 +681,23 @@ require("./taro");
                     "default-source": ""
                 },
                 Camera: {
-                    mode: Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["singleQuote"])("normal"),
-                    "output-dimension": Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["singleQuote"])("720P"),
-                    "frame-size": Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["singleQuote"])("medium"),
+                    mode: Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["singleQuote"])("normal"),
+                    "output-dimension": Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["singleQuote"])("720P"),
+                    "frame-size": Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["singleQuote"])("medium"),
                     bindScanCode: "",
                     bindReady: ""
                 },
                 Canvas: {
                     type: "",
-                    width: Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["singleQuote"])("300px"),
-                    height: Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["singleQuote"])("225px"),
+                    width: Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["singleQuote"])("300px"),
+                    height: Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["singleQuote"])("225px"),
                     bindReady: ""
                 },
                 Video: {
-                    "poster-size": Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["singleQuote"])("contain"),
+                    "poster-size": Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["singleQuote"])("contain"),
                     "show-thin-progress-bar": "false",
                     "mobilenet-hint-type": "1",
-                    "floating-mode": Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["singleQuote"])("none"),
+                    "floating-mode": Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["singleQuote"])("none"),
                     enableNative: "true",
                     bindLoading: "",
                     bindUserAction: "",
@@ -716,15 +738,15 @@ require("./taro");
                     "tnt-inst-id": "",
                     scene: "",
                     size: "25",
-                    color: Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["singleQuote"])("#00A3FF"),
+                    color: Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["singleQuote"])("#00A3FF"),
                     icon: "",
                     "alipay-card-no": "",
                     "ext-info": ""
                 },
                 ArCamera: {
-                    devicePosition: Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["singleQuote"])("back"),
+                    devicePosition: Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["singleQuote"])("back"),
                     marker: "",
-                    mode: Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["singleQuote"])("imageTracking"),
+                    mode: Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["singleQuote"])("imageTracking"),
                     useCapturedImage: "false",
                     bindInit: "",
                     bindStop: "",
@@ -736,7 +758,7 @@ require("./taro");
                     duration: "300",
                     "z-index": "100",
                     overlay: "true",
-                    position: Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["singleQuote"])("bottom"),
+                    position: Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["singleQuote"])("bottom"),
                     round: "false",
                     "close-on-slide-down": "false",
                     "overlay-style": "",
@@ -755,10 +777,22 @@ require("./taro");
                     name: "",
                     transform: "false",
                     duration: "300",
-                    "easing-function": Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["singleQuote"])("ease-out")
+                    "easing-function": Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["singleQuote"])("ease-out")
                 },
                 RootPortal: {
                     enable: "true"
+                },
+                PageMeta: {
+                    "background-color": "",
+                    "background-color-top": "",
+                    "background-color-bottom": "",
+                    "root-background-color": "",
+                    "scroll-top": "''",
+                    "scroll-duration": "300",
+                    "page-style": "''",
+                    "root-font-size": "''",
+                    "page-font-size": "''",
+                    bindScroll: ""
                 }
             };
             var BUBBLE_EVENTS = new Set([ "touchStart", "touchMove", "touchEnd", "touchCancel", "tap", "longTap" ]);
@@ -782,6 +816,20 @@ require("./taro");
                 },
                 isBubbleEvents: function isBubbleEvents(eventName) {
                     return BUBBLE_EVENTS.has(eventName);
+                },
+                transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                    var _a;
+                    if (element.isTransferElement) {
+                        var _ref;
+                        var page = getCurrentPages()[0];
+                        data["nn"] = element.dataName;
+                        page.setData(Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_0__["a"])({}, Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["toCamelCase"])(data.nn), data));
+                        return _ref = {
+                            sid: element.sid
+                        }, Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_0__["a"])(_ref, "v", ""), 
+                        Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_0__["a"])(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                        _ref;
+                    }
                 }
             };
             var _navigator = navigator, userAgent = _navigator.userAgent;
@@ -792,23 +840,23 @@ require("./taro");
                     return userAgent || navigator.swuserAgent || "";
                 }
             });
-            Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["d"])(hostConfig);
-            Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["c"])(components);
+            Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["d"])(hostConfig);
+            Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["c"])(components);
         }).call(this, __webpack_require__(4)["navigator"]);
     },
-    13: function(module, exports, __webpack_require__) {},
-    17: function(module, __webpack_exports__, __webpack_require__) {
+    15: function(module, exports, __webpack_require__) {},
+    19: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
-        var runtime = __webpack_require__(12);
+        var runtime = __webpack_require__(14);
         var taro_runtime = __webpack_require__(4);
         var taro = __webpack_require__(0);
         var classCallCheck = __webpack_require__(5);
-        var createClass = __webpack_require__(7);
+        var createClass = __webpack_require__(6);
         var inherits = __webpack_require__(8);
-        var createSuper = __webpack_require__(6);
+        var createSuper = __webpack_require__(7);
         var react = __webpack_require__(1);
-        var app = __webpack_require__(13);
+        var app = __webpack_require__(15);
         var app_App = function(_Component) {
             Object(inherits["a"])(App, _Component);
             var _super = Object(createSuper["a"])(App);
@@ -834,7 +882,7 @@ require("./taro");
             return App;
         }(react["Component"]);
         var lib_src_app = app_App;
-        var taro_react = __webpack_require__(9);
+        var taro_react = __webpack_require__(11);
         var config = {
             pages: [ "pages/index/index" ],
             window: {
@@ -858,7 +906,7 @@ require("./taro");
             targetUnit: undefined
         });
     }
-}, [ [ 17, 0, 1, 3, 2 ] ] ]);
+}, [ [ 19, 0, 1, 3, 2 ] ] ]);
 
 
 
@@ -1035,8 +1083,8 @@ require("./taro");
 /** filePath: dist/pages/index/index.js **/
 /*! For license information please see index.js.LICENSE.txt */
 (my["webpackJsonp"] = my["webpackJsonp"] || []).push([ [ 7 ], {
-    15: function(module, exports, __webpack_require__) {},
-    16: function(module, __webpack_exports__, __webpack_require__) {
+    17: function(module, exports, __webpack_require__) {},
+    18: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(4);
@@ -1376,12 +1424,12 @@ require("./taro");
             };
         }
         var classCallCheck = __webpack_require__(5);
-        var createClass = __webpack_require__(7);
+        var createClass = __webpack_require__(6);
         var inherits = __webpack_require__(8);
-        var createSuper = __webpack_require__(6);
+        var createSuper = __webpack_require__(7);
         var react = __webpack_require__(1);
         var taro_components = __webpack_require__(2);
-        var index = __webpack_require__(15);
+        var index = __webpack_require__(17);
         var index_Index = function(_Component) {
             Object(inherits["a"])(Index, _Component);
             var _super = Object(createSuper["a"])(Index);
@@ -1447,7 +1495,7 @@ require("./taro");
         }, config || {}));
         var pages_index = __webpack_exports__["default"] = index_Index;
     }
-}, [ [ 16, 0, 1, 3, 2 ] ] ]);
+}, [ [ 18, 0, 1, 3, 2 ] ] ]);
 
 /** filePath: dist/pages/index/index.js.LICENSE.txt **/
 /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */
@@ -1461,6 +1509,10 @@ require("./taro");
 
 /** filePath: dist/taro.js **/
 (my["webpackJsonp"] = my["webpackJsonp"] || []).push([ [ 1 ], {
+    11: function(module, __webpack_exports__, __webpack_require__) {
+        "use strict";
+        __webpack_exports__["a"] = "taro-react-mock";
+    },
     2: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         var _unused_webpack_default_export = "taro-components-mock";
@@ -1469,10 +1521,6 @@ require("./taro");
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         __webpack_exports__["default"] = "taro-runtime-mock";
-    },
-    9: function(module, __webpack_exports__, __webpack_require__) {
-        "use strict";
-        __webpack_exports__["a"] = "taro-react-mock";
     }
 } ]);
 
@@ -1520,6 +1568,29 @@ export default {
             throw new TypeError("Cannot call a class as a function");
         }
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _createClass;
+    }));
+    var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(9);
+    function _defineProperties(target, props) {
+        for (var i = 0; i < props.length; i++) {
+            var descriptor = props[i];
+            descriptor.enumerable = descriptor.enumerable || false;
+            descriptor.configurable = true;
+            if ("value" in descriptor) descriptor.writable = true;
+            Object.defineProperty(target, Object(_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["a"])(descriptor.key), descriptor);
+        }
+    }
+    function _createClass(Constructor, protoProps, staticProps) {
+        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+        if (staticProps) _defineProperties(Constructor, staticProps);
+        Object.defineProperty(Constructor, "prototype", {
+            writable: false
+        });
+        return Constructor;
+    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -1570,43 +1641,6 @@ export default {
             return _possibleConstructorReturn(this, result);
         };
     }
-}, function(module, __webpack_exports__, __webpack_require__) {
-    "use strict";
-    __webpack_require__.d(__webpack_exports__, "a", (function() {
-        return _createClass;
-    }));
-    var esm_typeof = __webpack_require__(3);
-    function _toPrimitive(input, hint) {
-        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
-        var prim = input[Symbol.toPrimitive];
-        if (prim !== undefined) {
-            var res = prim.call(input, hint || "default");
-            if (Object(esm_typeof["a"])(res) !== "object") return res;
-            throw new TypeError("@@toPrimitive must return a primitive value.");
-        }
-        return (hint === "string" ? String : Number)(input);
-    }
-    function _toPropertyKey(arg) {
-        var key = _toPrimitive(arg, "string");
-        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
-    }
-    function _defineProperties(target, props) {
-        for (var i = 0; i < props.length; i++) {
-            var descriptor = props[i];
-            descriptor.enumerable = descriptor.enumerable || false;
-            descriptor.configurable = true;
-            if ("value" in descriptor) descriptor.writable = true;
-            Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
-        }
-    }
-    function _createClass(Constructor, protoProps, staticProps) {
-        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
-        if (staticProps) _defineProperties(Constructor, staticProps);
-        Object.defineProperty(Constructor, "prototype", {
-            writable: false
-        });
-        return Constructor;
-    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -1635,6 +1669,26 @@ export default {
         });
         if (superClass) _setPrototypeOf(subClass, superClass);
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _toPropertyKey;
+    }));
+    var esm_typeof = __webpack_require__(3);
+    function _toPrimitive(input, hint) {
+        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
+        var prim = input[Symbol.toPrimitive];
+        if (prim !== undefined) {
+            var res = prim.call(input, hint || "default");
+            if (Object(esm_typeof["a"])(res) !== "object") return res;
+            throw new TypeError("@@toPrimitive must return a primitive value.");
+        }
+        return (hint === "string" ? String : Number)(input);
+    }
+    function _toPropertyKey(arg) {
+        var key = _toPrimitive(arg, "string");
+        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
+    }
 } ] ]);
 "
 `;
diff --git a/packages/taro-mini-runner/src/__tests__/__snapshots__/babel.spec.ts.snap b/packages/taro-mini-runner/src/__tests__/__snapshots__/babel.spec.ts.snap
index 4e15ccc3f9e..6b2482203dd 100644
--- a/packages/taro-mini-runner/src/__tests__/__snapshots__/babel.spec.ts.snap
+++ b/packages/taro-mini-runner/src/__tests__/__snapshots__/babel.spec.ts.snap
@@ -14,10 +14,25 @@ require("./vendors");
 require("./taro");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 4 ], {
-    11: function(module, exports, __webpack_require__) {},
-    15: function(module, __webpack_exports__, __webpack_require__) {
+    12: function(module, exports, __webpack_require__) {},
+    16: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
+        var toPropertyKey = __webpack_require__(7);
+        function _defineProperty(obj, key, value) {
+            key = Object(toPropertyKey["a"])(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         var mocks_taro = "taro";
         function mergeReconciler() {}
         function mergeInternalComponents() {}
@@ -429,7 +444,7 @@ require("./taro");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -439,10 +454,12 @@ require("./taro");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -511,17 +528,30 @@ require("./taro");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, undefined(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
         mergeInternalComponents(components);
         var taro_runtime = __webpack_require__(0);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(1);
-        var app = __webpack_require__(11);
+        var app = __webpack_require__(12);
         var app_App = function(_Component) {
             Object(inherits["a"])(App, _Component);
             var _super = Object(createSuper["a"])(App);
@@ -547,7 +577,7 @@ require("./taro");
             return App;
         }(react["Component"]);
         var lib_src_app = app_App;
-        var taro_react = __webpack_require__(8);
+        var taro_react = __webpack_require__(9);
         var config = {
             pages: [ "pages/index/index" ],
             window: {
@@ -571,7 +601,7 @@ require("./taro");
             targetUnit: undefined
         });
     }
-}, [ [ 15, 0, 1, 3, 2 ] ] ]);
+}, [ [ 16, 0, 1, 3, 2 ] ] ]);
 
 
 
@@ -1308,13 +1338,13 @@ require("./taro");
 
 /** filePath: dist/comp.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 6 ], {
-    12: function(module, __webpack_exports__, __webpack_require__) {
+    13: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var _tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(0);
         Component(Object(_tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__["createRecursiveComponentConfig"])());
     }
-}, [ [ 12, 0, 1 ] ] ]);
+}, [ [ 13, 0, 1 ] ] ]);
 
 /** filePath: dist/comp.json **/
 {"component":true,"usingComponents":{"comp":"./comp"}}
@@ -1326,18 +1356,18 @@ require("./taro");
 
 /** filePath: dist/pages/index/index.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 8 ], {
-    14: function(module, exports, __webpack_require__) {},
-    16: function(module, __webpack_exports__, __webpack_require__) {
+    15: function(module, exports, __webpack_require__) {},
+    17: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(0);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(1);
-        var taro_components = __webpack_require__(7);
-        var index = __webpack_require__(14);
+        var taro_components = __webpack_require__(8);
+        var index = __webpack_require__(15);
         var index_Index = function(_Component) {
             Object(inherits["a"])(Index, _Component);
             var _super = Object(createSuper["a"])(Index);
@@ -1370,7 +1400,7 @@ require("./taro");
         }, config || {}));
         var pages_index = __webpack_exports__["default"] = index_Index;
     }
-}, [ [ 16, 0, 1, 3, 2 ] ] ]);
+}, [ [ 17, 0, 1, 3, 2 ] ] ]);
 
 /** filePath: dist/pages/index/index.json **/
 {"navigationBarTitleText":"首页","usingComponents":{"comp":"../../comp"}}
@@ -1391,11 +1421,11 @@ require("./taro");
         "use strict";
         var _unused_webpack_default_export = "taro-runtime-mock";
     },
-    7: function(module, __webpack_exports__, __webpack_require__) {
+    8: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         var _unused_webpack_default_export = "taro-components-mock";
     },
-    8: function(module, __webpack_exports__, __webpack_require__) {
+    9: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_exports__["a"] = "taro-react-mock";
     }
@@ -1466,6 +1496,29 @@ module.exports = {
             throw new TypeError("Cannot call a class as a function");
         }
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _createClass;
+    }));
+    var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(7);
+    function _defineProperties(target, props) {
+        for (var i = 0; i < props.length; i++) {
+            var descriptor = props[i];
+            descriptor.enumerable = descriptor.enumerable || false;
+            descriptor.configurable = true;
+            if ("value" in descriptor) descriptor.writable = true;
+            Object.defineProperty(target, Object(_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["a"])(descriptor.key), descriptor);
+        }
+    }
+    function _createClass(Constructor, protoProps, staticProps) {
+        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+        if (staticProps) _defineProperties(Constructor, staticProps);
+        Object.defineProperty(Constructor, "prototype", {
+            writable: false
+        });
+        return Constructor;
+    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -1516,43 +1569,6 @@ module.exports = {
             return _possibleConstructorReturn(this, result);
         };
     }
-}, function(module, __webpack_exports__, __webpack_require__) {
-    "use strict";
-    __webpack_require__.d(__webpack_exports__, "a", (function() {
-        return _createClass;
-    }));
-    var esm_typeof = __webpack_require__(2);
-    function _toPrimitive(input, hint) {
-        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
-        var prim = input[Symbol.toPrimitive];
-        if (prim !== undefined) {
-            var res = prim.call(input, hint || "default");
-            if (Object(esm_typeof["a"])(res) !== "object") return res;
-            throw new TypeError("@@toPrimitive must return a primitive value.");
-        }
-        return (hint === "string" ? String : Number)(input);
-    }
-    function _toPropertyKey(arg) {
-        var key = _toPrimitive(arg, "string");
-        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
-    }
-    function _defineProperties(target, props) {
-        for (var i = 0; i < props.length; i++) {
-            var descriptor = props[i];
-            descriptor.enumerable = descriptor.enumerable || false;
-            descriptor.configurable = true;
-            if ("value" in descriptor) descriptor.writable = true;
-            Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
-        }
-    }
-    function _createClass(Constructor, protoProps, staticProps) {
-        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
-        if (staticProps) _defineProperties(Constructor, staticProps);
-        Object.defineProperty(Constructor, "prototype", {
-            writable: false
-        });
-        return Constructor;
-    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -1581,6 +1597,26 @@ module.exports = {
         });
         if (superClass) _setPrototypeOf(subClass, superClass);
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _toPropertyKey;
+    }));
+    var esm_typeof = __webpack_require__(2);
+    function _toPrimitive(input, hint) {
+        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
+        var prim = input[Symbol.toPrimitive];
+        if (prim !== undefined) {
+            var res = prim.call(input, hint || "default");
+            if (Object(esm_typeof["a"])(res) !== "object") return res;
+            throw new TypeError("@@toPrimitive must return a primitive value.");
+        }
+        return (hint === "string" ? String : Number)(input);
+    }
+    function _toPropertyKey(arg) {
+        var key = _toPrimitive(arg, "string");
+        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
+    }
 } ] ]);
 "
 `;
diff --git a/packages/taro-mini-runner/src/__tests__/__snapshots__/common-style.spec.ts.snap b/packages/taro-mini-runner/src/__tests__/__snapshots__/common-style.spec.ts.snap
index ab4c59d2707..3e7551c872b 100644
--- a/packages/taro-mini-runner/src/__tests__/__snapshots__/common-style.spec.ts.snap
+++ b/packages/taro-mini-runner/src/__tests__/__snapshots__/common-style.spec.ts.snap
@@ -17,10 +17,25 @@ require("./vendors");
 require("./taro");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 4 ], {
-    13: function(module, exports, __webpack_require__) {},
-    17: function(module, __webpack_exports__, __webpack_require__) {
+    14: function(module, exports, __webpack_require__) {},
+    18: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
+        var toPropertyKey = __webpack_require__(9);
+        function _defineProperty(obj, key, value) {
+            key = Object(toPropertyKey["a"])(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         var mocks_taro = "taro";
         function mergeReconciler() {}
         function mergeInternalComponents() {}
@@ -432,7 +447,7 @@ require("./taro");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -442,10 +457,12 @@ require("./taro");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -514,17 +531,30 @@ require("./taro");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, undefined(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
         mergeInternalComponents(components);
         var taro_runtime = __webpack_require__(1);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(0);
-        var app = __webpack_require__(13);
+        var app = __webpack_require__(14);
         var app_App = function(_Component) {
             Object(inherits["a"])(App, _Component);
             var _super = Object(createSuper["a"])(App);
@@ -550,7 +580,7 @@ require("./taro");
             return App;
         }(react["Component"]);
         var lib_src_app = app_App;
-        var taro_react = __webpack_require__(9);
+        var taro_react = __webpack_require__(10);
         var config = {
             pages: [ "pages/index/index", "pages/about/index" ],
             window: {
@@ -574,7 +604,7 @@ require("./taro");
             targetUnit: undefined
         });
     }
-}, [ [ 17, 0, 1, 3, 2 ] ] ]);
+}, [ [ 18, 0, 1, 3, 2 ] ] ]);
 
 
 
@@ -1311,19 +1341,19 @@ require("./taro");
         __webpack_require__.r(__webpack_exports__);
         __webpack_exports__["default"] = "react-mock";
     },
-    16: function(module, exports, __webpack_require__) {},
+    17: function(module, exports, __webpack_require__) {},
     8: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.d(__webpack_exports__, "a", (function() {
             return Index;
         }));
         var _babel_runtime_helpers_esm_classCallCheck__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(3);
-        var _babel_runtime_helpers_esm_createClass__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(5);
+        var _babel_runtime_helpers_esm_createClass__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(4);
         var _babel_runtime_helpers_esm_inherits__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(6);
-        var _babel_runtime_helpers_esm_createSuper__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(4);
+        var _babel_runtime_helpers_esm_createSuper__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(5);
         var react__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(0);
         var _tarojs_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(2);
-        var _index_scss__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(16);
+        var _index_scss__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(17);
         var _index_scss__WEBPACK_IMPORTED_MODULE_6___default = __webpack_require__.n(_index_scss__WEBPACK_IMPORTED_MODULE_6__);
         var Index = function(_Component) {
             Object(_babel_runtime_helpers_esm_inherits__WEBPACK_IMPORTED_MODULE_2__["a"])(Index, _Component);
@@ -1350,13 +1380,13 @@ require("./taro");
 
 /** filePath: dist/comp.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 6 ], {
-    14: function(module, __webpack_exports__, __webpack_require__) {
+    15: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var _tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(1);
         Component(Object(_tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__["createRecursiveComponentConfig"])());
     }
-}, [ [ 14, 0, 1 ] ] ]);
+}, [ [ 15, 0, 1 ] ] ]);
 
 /** filePath: dist/comp.json **/
 {"component":true,"usingComponents":{"comp":"./comp"}}
@@ -1368,14 +1398,14 @@ require("./taro");
 
 /** filePath: dist/pages/about/index.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 8 ], {
-    19: function(module, __webpack_exports__, __webpack_require__) {
+    20: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(1);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(0);
         var taro_components = __webpack_require__(2);
         var title = __webpack_require__(8);
@@ -1408,7 +1438,7 @@ require("./taro");
         }, config || {}));
         var about = __webpack_exports__["default"] = about_Index;
     }
-}, [ [ 19, 0, 1, 3, 2 ] ] ]);
+}, [ [ 20, 0, 1, 3, 2 ] ] ]);
 
 /** filePath: dist/pages/about/index.json **/
 {"navigationBarTitleText":"关于","usingComponents":{"comp":"../../comp"}}
@@ -1419,14 +1449,14 @@ require("./taro");
 
 /** filePath: dist/pages/index/index.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 10 ], {
-    18: function(module, __webpack_exports__, __webpack_require__) {
+    19: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(1);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(0);
         var taro_components = __webpack_require__(2);
         var title = __webpack_require__(8);
@@ -1459,7 +1489,7 @@ require("./taro");
         }, config || {}));
         var index = __webpack_exports__["default"] = index_Index;
     }
-}, [ [ 18, 0, 1, 3, 2 ] ] ]);
+}, [ [ 19, 0, 1, 3, 2 ] ] ]);
 
 /** filePath: dist/pages/index/index.json **/
 {"navigationBarTitleText":"首页","usingComponents":{"comp":"../../comp"}}
@@ -1477,13 +1507,13 @@ require("./taro");
         "use strict";
         var _unused_webpack_default_export = "taro-runtime-mock";
     },
-    2: function(module, __webpack_exports__, __webpack_require__) {
+    10: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
-        var _unused_webpack_default_export = "taro-components-mock";
+        __webpack_exports__["a"] = "taro-react-mock";
     },
-    9: function(module, __webpack_exports__, __webpack_require__) {
+    2: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
-        __webpack_exports__["a"] = "taro-react-mock";
+        var _unused_webpack_default_export = "taro-components-mock";
     }
 } ]);
 
@@ -1539,6 +1569,29 @@ module.exports = {
             throw new TypeError("Cannot call a class as a function");
         }
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _createClass;
+    }));
+    var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(9);
+    function _defineProperties(target, props) {
+        for (var i = 0; i < props.length; i++) {
+            var descriptor = props[i];
+            descriptor.enumerable = descriptor.enumerable || false;
+            descriptor.configurable = true;
+            if ("value" in descriptor) descriptor.writable = true;
+            Object.defineProperty(target, Object(_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["a"])(descriptor.key), descriptor);
+        }
+    }
+    function _createClass(Constructor, protoProps, staticProps) {
+        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+        if (staticProps) _defineProperties(Constructor, staticProps);
+        Object.defineProperty(Constructor, "prototype", {
+            writable: false
+        });
+        return Constructor;
+    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -1589,43 +1642,6 @@ module.exports = {
             return _possibleConstructorReturn(this, result);
         };
     }
-}, function(module, __webpack_exports__, __webpack_require__) {
-    "use strict";
-    __webpack_require__.d(__webpack_exports__, "a", (function() {
-        return _createClass;
-    }));
-    var esm_typeof = __webpack_require__(7);
-    function _toPrimitive(input, hint) {
-        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
-        var prim = input[Symbol.toPrimitive];
-        if (prim !== undefined) {
-            var res = prim.call(input, hint || "default");
-            if (Object(esm_typeof["a"])(res) !== "object") return res;
-            throw new TypeError("@@toPrimitive must return a primitive value.");
-        }
-        return (hint === "string" ? String : Number)(input);
-    }
-    function _toPropertyKey(arg) {
-        var key = _toPrimitive(arg, "string");
-        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
-    }
-    function _defineProperties(target, props) {
-        for (var i = 0; i < props.length; i++) {
-            var descriptor = props[i];
-            descriptor.enumerable = descriptor.enumerable || false;
-            descriptor.configurable = true;
-            if ("value" in descriptor) descriptor.writable = true;
-            Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
-        }
-    }
-    function _createClass(Constructor, protoProps, staticProps) {
-        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
-        if (staticProps) _defineProperties(Constructor, staticProps);
-        Object.defineProperty(Constructor, "prototype", {
-            writable: false
-        });
-        return Constructor;
-    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -1667,6 +1683,26 @@ module.exports = {
             return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
         }, _typeof(obj);
     }
+}, , function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _toPropertyKey;
+    }));
+    var esm_typeof = __webpack_require__(7);
+    function _toPrimitive(input, hint) {
+        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
+        var prim = input[Symbol.toPrimitive];
+        if (prim !== undefined) {
+            var res = prim.call(input, hint || "default");
+            if (Object(esm_typeof["a"])(res) !== "object") return res;
+            throw new TypeError("@@toPrimitive must return a primitive value.");
+        }
+        return (hint === "string" ? String : Number)(input);
+    }
+    function _toPropertyKey(arg) {
+        var key = _toPrimitive(arg, "string");
+        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
+    }
 } ] ]);
 "
 `;
diff --git a/packages/taro-mini-runner/src/__tests__/__snapshots__/compiler-macros.spec.ts.snap b/packages/taro-mini-runner/src/__tests__/__snapshots__/compiler-macros.spec.ts.snap
index 0eed2666a1c..ed4c36d2830 100644
--- a/packages/taro-mini-runner/src/__tests__/__snapshots__/compiler-macros.spec.ts.snap
+++ b/packages/taro-mini-runner/src/__tests__/__snapshots__/compiler-macros.spec.ts.snap
@@ -14,10 +14,25 @@ require("./vendors");
 require("./taro");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 4 ], {
-    10: function(module, exports, __webpack_require__) {},
-    14: function(module, __webpack_exports__, __webpack_require__) {
+    11: function(module, exports, __webpack_require__) {},
+    15: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
+        var toPropertyKey = __webpack_require__(7);
+        function _defineProperty(obj, key, value) {
+            key = Object(toPropertyKey["a"])(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         var mocks_taro = "taro";
         function mergeReconciler() {}
         function mergeInternalComponents() {}
@@ -429,7 +444,7 @@ require("./taro");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -439,10 +454,12 @@ require("./taro");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -511,17 +528,30 @@ require("./taro");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, undefined(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
         mergeInternalComponents(components);
         var taro_runtime = __webpack_require__(0);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(1);
-        var app = __webpack_require__(10);
+        var app = __webpack_require__(11);
         var app_App = function(_Component) {
             Object(inherits["a"])(App, _Component);
             var _super = Object(createSuper["a"])(App);
@@ -547,7 +577,7 @@ require("./taro");
             return App;
         }(react["Component"]);
         var lib_src_app = app_App;
-        var taro_react = __webpack_require__(8);
+        var taro_react = __webpack_require__(9);
         var config = {
             pages: [ "pages/index/index" ],
             window: {
@@ -571,7 +601,7 @@ require("./taro");
             targetUnit: undefined
         });
     }
-}, [ [ 14, 0, 1, 3, 2 ] ] ]);
+}, [ [ 15, 0, 1, 3, 2 ] ] ]);
 
 
 
@@ -1308,13 +1338,13 @@ require("./taro");
 
 /** filePath: dist/comp.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 6 ], {
-    11: function(module, __webpack_exports__, __webpack_require__) {
+    12: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var _tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(0);
         Component(Object(_tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__["createRecursiveComponentConfig"])());
     }
-}, [ [ 11, 0, 1 ] ] ]);
+}, [ [ 12, 0, 1 ] ] ]);
 
 /** filePath: dist/comp.json **/
 {"component":true,"usingComponents":{"comp":"./comp"}}
@@ -1326,18 +1356,18 @@ require("./taro");
 
 /** filePath: dist/pages/index/index.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 8 ], {
-    13: function(module, exports, __webpack_require__) {},
-    15: function(module, __webpack_exports__, __webpack_require__) {
+    14: function(module, exports, __webpack_require__) {},
+    16: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(0);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(1);
-        var taro_components = __webpack_require__(7);
-        var index = __webpack_require__(13);
+        var taro_components = __webpack_require__(8);
+        var index = __webpack_require__(14);
         var index_Index = function(_Component) {
             Object(inherits["a"])(Index, _Component);
             var _super = Object(createSuper["a"])(Index);
@@ -1365,7 +1395,7 @@ require("./taro");
         }, config || {}));
         var pages_index = __webpack_exports__["default"] = index_Index;
     }
-}, [ [ 15, 0, 1, 3, 2 ] ] ]);
+}, [ [ 16, 0, 1, 3, 2 ] ] ]);
 
 /** filePath: dist/pages/index/index.json **/
 {"navigationBarTitleText":"首页","usingComponents":{"comp":"../../comp"}}
@@ -1386,11 +1416,11 @@ require("./taro");
         "use strict";
         var _unused_webpack_default_export = "taro-runtime-mock";
     },
-    7: function(module, __webpack_exports__, __webpack_require__) {
+    8: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         var _unused_webpack_default_export = "taro-components-mock";
     },
-    8: function(module, __webpack_exports__, __webpack_require__) {
+    9: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_exports__["a"] = "taro-react-mock";
     }
@@ -1461,6 +1491,29 @@ module.exports = {
             throw new TypeError("Cannot call a class as a function");
         }
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _createClass;
+    }));
+    var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(7);
+    function _defineProperties(target, props) {
+        for (var i = 0; i < props.length; i++) {
+            var descriptor = props[i];
+            descriptor.enumerable = descriptor.enumerable || false;
+            descriptor.configurable = true;
+            if ("value" in descriptor) descriptor.writable = true;
+            Object.defineProperty(target, Object(_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["a"])(descriptor.key), descriptor);
+        }
+    }
+    function _createClass(Constructor, protoProps, staticProps) {
+        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+        if (staticProps) _defineProperties(Constructor, staticProps);
+        Object.defineProperty(Constructor, "prototype", {
+            writable: false
+        });
+        return Constructor;
+    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -1511,43 +1564,6 @@ module.exports = {
             return _possibleConstructorReturn(this, result);
         };
     }
-}, function(module, __webpack_exports__, __webpack_require__) {
-    "use strict";
-    __webpack_require__.d(__webpack_exports__, "a", (function() {
-        return _createClass;
-    }));
-    var esm_typeof = __webpack_require__(2);
-    function _toPrimitive(input, hint) {
-        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
-        var prim = input[Symbol.toPrimitive];
-        if (prim !== undefined) {
-            var res = prim.call(input, hint || "default");
-            if (Object(esm_typeof["a"])(res) !== "object") return res;
-            throw new TypeError("@@toPrimitive must return a primitive value.");
-        }
-        return (hint === "string" ? String : Number)(input);
-    }
-    function _toPropertyKey(arg) {
-        var key = _toPrimitive(arg, "string");
-        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
-    }
-    function _defineProperties(target, props) {
-        for (var i = 0; i < props.length; i++) {
-            var descriptor = props[i];
-            descriptor.enumerable = descriptor.enumerable || false;
-            descriptor.configurable = true;
-            if ("value" in descriptor) descriptor.writable = true;
-            Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
-        }
-    }
-    function _createClass(Constructor, protoProps, staticProps) {
-        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
-        if (staticProps) _defineProperties(Constructor, staticProps);
-        Object.defineProperty(Constructor, "prototype", {
-            writable: false
-        });
-        return Constructor;
-    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -1576,6 +1592,26 @@ module.exports = {
         });
         if (superClass) _setPrototypeOf(subClass, superClass);
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _toPropertyKey;
+    }));
+    var esm_typeof = __webpack_require__(2);
+    function _toPrimitive(input, hint) {
+        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
+        var prim = input[Symbol.toPrimitive];
+        if (prim !== undefined) {
+            var res = prim.call(input, hint || "default");
+            if (Object(esm_typeof["a"])(res) !== "object") return res;
+            throw new TypeError("@@toPrimitive must return a primitive value.");
+        }
+        return (hint === "string" ? String : Number)(input);
+    }
+    function _toPropertyKey(arg) {
+        var key = _toPrimitive(arg, "string");
+        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
+    }
 } ] ]);
 "
 `;
diff --git a/packages/taro-mini-runner/src/__tests__/__snapshots__/config.spec.ts.snap b/packages/taro-mini-runner/src/__tests__/__snapshots__/config.spec.ts.snap
index f8e73a222ed..37509b8abed 100644
--- a/packages/taro-mini-runner/src/__tests__/__snapshots__/config.spec.ts.snap
+++ b/packages/taro-mini-runner/src/__tests__/__snapshots__/config.spec.ts.snap
@@ -14,10 +14,25 @@ require("./vendors");
 require("./taro");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 4 ], {
-    11: function(module, exports, __webpack_require__) {},
-    15: function(module, __webpack_exports__, __webpack_require__) {
+    12: function(module, exports, __webpack_require__) {},
+    16: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
+        var toPropertyKey = __webpack_require__(7);
+        function _defineProperty(obj, key, value) {
+            key = Object(toPropertyKey["a"])(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         var mocks_taro = "taro";
         function mergeReconciler() {}
         function mergeInternalComponents() {}
@@ -429,7 +444,7 @@ require("./taro");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -439,10 +454,12 @@ require("./taro");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -511,17 +528,30 @@ require("./taro");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, undefined(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
         mergeInternalComponents(components);
         var taro_runtime = __webpack_require__(0);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(1);
-        var app = __webpack_require__(11);
+        var app = __webpack_require__(12);
         var app_App = function(_Component) {
             Object(inherits["a"])(App, _Component);
             var _super = Object(createSuper["a"])(App);
@@ -547,7 +577,7 @@ require("./taro");
             return App;
         }(react["Component"]);
         var lib_origin_app = app_App;
-        var taro_react = __webpack_require__(8);
+        var taro_react = __webpack_require__(9);
         var config = {
             pages: [ "pages/index/index" ],
             window: {
@@ -571,7 +601,7 @@ require("./taro");
             targetUnit: undefined
         });
     }
-}, [ [ 15, 0, 1, 3, 2 ] ] ]);
+}, [ [ 16, 0, 1, 3, 2 ] ] ]);
 
 
 
@@ -1468,13 +1498,13 @@ require("./taro");
 
 /** filePath: dist/comp.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 6 ], {
-    12: function(module, __webpack_exports__, __webpack_require__) {
+    13: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var _tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(0);
         Component(Object(_tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__["createRecursiveComponentConfig"])());
     }
-}, [ [ 12, 0, 1 ] ] ]);
+}, [ [ 13, 0, 1 ] ] ]);
 
 /** filePath: dist/comp.json **/
 {"component":true,"usingComponents":{"comp":"./comp"}}
@@ -1486,24 +1516,24 @@ require("./taro");
 
 /** filePath: dist/pages/index/index.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 8 ], {
-    14: function(module, exports, __webpack_require__) {},
-    16: function(module, __webpack_exports__, __webpack_require__) {
+    15: function(module, exports, __webpack_require__) {},
+    17: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(0);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(1);
-        var taro_components = __webpack_require__(7);
+        var taro_components = __webpack_require__(8);
         function say() {
             console.log("little cat");
         }
         function miao() {
             console.log("say: ", say());
         }
-        var index = __webpack_require__(14);
+        var index = __webpack_require__(15);
         var index_Index = function(_Component) {
             Object(inherits["a"])(Index, _Component);
             var _super = Object(createSuper["a"])(Index);
@@ -1536,7 +1566,7 @@ require("./taro");
         }, config || {}));
         var pages_index = __webpack_exports__["default"] = index_Index;
     }
-}, [ [ 16, 0, 1, 3, 2 ] ] ]);
+}, [ [ 17, 0, 1, 3, 2 ] ] ]);
 
 /** filePath: dist/pages/index/index.json **/
 {"navigationBarTitleText":"首页","usingComponents":{"comp":"../../comp"}}
@@ -1557,11 +1587,11 @@ require("./taro");
         "use strict";
         var _unused_webpack_default_export = "taro-runtime-mock";
     },
-    7: function(module, __webpack_exports__, __webpack_require__) {
+    8: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         var _unused_webpack_default_export = "taro-components-mock";
     },
-    8: function(module, __webpack_exports__, __webpack_require__) {
+    9: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_exports__["a"] = "taro-react-mock";
     }
@@ -1632,6 +1662,29 @@ module.exports = {
             throw new TypeError("Cannot call a class as a function");
         }
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _createClass;
+    }));
+    var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(7);
+    function _defineProperties(target, props) {
+        for (var i = 0; i < props.length; i++) {
+            var descriptor = props[i];
+            descriptor.enumerable = descriptor.enumerable || false;
+            descriptor.configurable = true;
+            if ("value" in descriptor) descriptor.writable = true;
+            Object.defineProperty(target, Object(_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["a"])(descriptor.key), descriptor);
+        }
+    }
+    function _createClass(Constructor, protoProps, staticProps) {
+        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+        if (staticProps) _defineProperties(Constructor, staticProps);
+        Object.defineProperty(Constructor, "prototype", {
+            writable: false
+        });
+        return Constructor;
+    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -1682,43 +1735,6 @@ module.exports = {
             return _possibleConstructorReturn(this, result);
         };
     }
-}, function(module, __webpack_exports__, __webpack_require__) {
-    "use strict";
-    __webpack_require__.d(__webpack_exports__, "a", (function() {
-        return _createClass;
-    }));
-    var esm_typeof = __webpack_require__(2);
-    function _toPrimitive(input, hint) {
-        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
-        var prim = input[Symbol.toPrimitive];
-        if (prim !== undefined) {
-            var res = prim.call(input, hint || "default");
-            if (Object(esm_typeof["a"])(res) !== "object") return res;
-            throw new TypeError("@@toPrimitive must return a primitive value.");
-        }
-        return (hint === "string" ? String : Number)(input);
-    }
-    function _toPropertyKey(arg) {
-        var key = _toPrimitive(arg, "string");
-        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
-    }
-    function _defineProperties(target, props) {
-        for (var i = 0; i < props.length; i++) {
-            var descriptor = props[i];
-            descriptor.enumerable = descriptor.enumerable || false;
-            descriptor.configurable = true;
-            if ("value" in descriptor) descriptor.writable = true;
-            Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
-        }
-    }
-    function _createClass(Constructor, protoProps, staticProps) {
-        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
-        if (staticProps) _defineProperties(Constructor, staticProps);
-        Object.defineProperty(Constructor, "prototype", {
-            writable: false
-        });
-        return Constructor;
-    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -1747,6 +1763,26 @@ module.exports = {
         });
         if (superClass) _setPrototypeOf(subClass, superClass);
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _toPropertyKey;
+    }));
+    var esm_typeof = __webpack_require__(2);
+    function _toPrimitive(input, hint) {
+        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
+        var prim = input[Symbol.toPrimitive];
+        if (prim !== undefined) {
+            var res = prim.call(input, hint || "default");
+            if (Object(esm_typeof["a"])(res) !== "object") return res;
+            throw new TypeError("@@toPrimitive must return a primitive value.");
+        }
+        return (hint === "string" ? String : Number)(input);
+    }
+    function _toPropertyKey(arg) {
+        var key = _toPrimitive(arg, "string");
+        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
+    }
 } ] ]);
 "
 `;
@@ -1765,10 +1801,25 @@ require("./vendors");
 require("./taro");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 4 ], {
-    11: function(module, exports, __webpack_require__) {},
-    15: function(module, __webpack_exports__, __webpack_require__) {
+    12: function(module, exports, __webpack_require__) {},
+    16: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
+        var toPropertyKey = __webpack_require__(7);
+        function _defineProperty(obj, key, value) {
+            key = Object(toPropertyKey["a"])(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         var mocks_taro = "taro";
         function mergeReconciler() {}
         function mergeInternalComponents() {}
@@ -2180,7 +2231,7 @@ require("./taro");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -2190,10 +2241,12 @@ require("./taro");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -2262,17 +2315,30 @@ require("./taro");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, undefined(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
         mergeInternalComponents(components);
         var taro_runtime = __webpack_require__(0);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(1);
-        var app = __webpack_require__(11);
+        var app = __webpack_require__(12);
         var app_App = function(_Component) {
             Object(inherits["a"])(App, _Component);
             var _super = Object(createSuper["a"])(App);
@@ -2298,7 +2364,7 @@ require("./taro");
             return App;
         }(react["Component"]);
         var lib_origin_app = app_App;
-        var taro_react = __webpack_require__(8);
+        var taro_react = __webpack_require__(9);
         var config = {
             pages: [ "pages/index/index" ],
             window: {
@@ -2322,7 +2388,7 @@ require("./taro");
             targetUnit: undefined
         });
     }
-}, [ [ 15, 0, 1, 3, 2 ] ] ]);
+}, [ [ 16, 0, 1, 3, 2 ] ] ]);
 
 
 
@@ -3059,13 +3125,13 @@ require("./taro");
 
 /** filePath: output/comp.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 6 ], {
-    12: function(module, __webpack_exports__, __webpack_require__) {
+    13: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var _tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(0);
         Component(Object(_tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__["createRecursiveComponentConfig"])());
     }
-}, [ [ 12, 0, 1 ] ] ]);
+}, [ [ 13, 0, 1 ] ] ]);
 
 /** filePath: output/comp.json **/
 {"component":true,"usingComponents":{"comp":"./comp"}}
@@ -3077,24 +3143,24 @@ require("./taro");
 
 /** filePath: output/pages/index/index.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 8 ], {
-    14: function(module, exports, __webpack_require__) {},
-    16: function(module, __webpack_exports__, __webpack_require__) {
+    15: function(module, exports, __webpack_require__) {},
+    17: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(0);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(1);
-        var taro_components = __webpack_require__(7);
+        var taro_components = __webpack_require__(8);
         function say() {
             console.log("little cat");
         }
         function miao() {
             console.log("say: ", say());
         }
-        var index = __webpack_require__(14);
+        var index = __webpack_require__(15);
         var index_Index = function(_Component) {
             Object(inherits["a"])(Index, _Component);
             var _super = Object(createSuper["a"])(Index);
@@ -3127,7 +3193,7 @@ require("./taro");
         }, config || {}));
         var pages_index = __webpack_exports__["default"] = index_Index;
     }
-}, [ [ 16, 0, 1, 3, 2 ] ] ]);
+}, [ [ 17, 0, 1, 3, 2 ] ] ]);
 
 /** filePath: output/pages/index/index.json **/
 {"navigationBarTitleText":"首页","usingComponents":{"comp":"../../comp"}}
@@ -3262,11 +3328,11 @@ require("./taro");
         "use strict";
         var _unused_webpack_default_export = "taro-runtime-mock";
     },
-    7: function(module, __webpack_exports__, __webpack_require__) {
+    8: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         var _unused_webpack_default_export = "taro-components-mock";
     },
-    8: function(module, __webpack_exports__, __webpack_require__) {
+    9: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_exports__["a"] = "taro-react-mock";
     }
@@ -3337,6 +3403,29 @@ module.exports = {
             throw new TypeError("Cannot call a class as a function");
         }
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _createClass;
+    }));
+    var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(7);
+    function _defineProperties(target, props) {
+        for (var i = 0; i < props.length; i++) {
+            var descriptor = props[i];
+            descriptor.enumerable = descriptor.enumerable || false;
+            descriptor.configurable = true;
+            if ("value" in descriptor) descriptor.writable = true;
+            Object.defineProperty(target, Object(_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["a"])(descriptor.key), descriptor);
+        }
+    }
+    function _createClass(Constructor, protoProps, staticProps) {
+        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+        if (staticProps) _defineProperties(Constructor, staticProps);
+        Object.defineProperty(Constructor, "prototype", {
+            writable: false
+        });
+        return Constructor;
+    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -3387,43 +3476,6 @@ module.exports = {
             return _possibleConstructorReturn(this, result);
         };
     }
-}, function(module, __webpack_exports__, __webpack_require__) {
-    "use strict";
-    __webpack_require__.d(__webpack_exports__, "a", (function() {
-        return _createClass;
-    }));
-    var esm_typeof = __webpack_require__(2);
-    function _toPrimitive(input, hint) {
-        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
-        var prim = input[Symbol.toPrimitive];
-        if (prim !== undefined) {
-            var res = prim.call(input, hint || "default");
-            if (Object(esm_typeof["a"])(res) !== "object") return res;
-            throw new TypeError("@@toPrimitive must return a primitive value.");
-        }
-        return (hint === "string" ? String : Number)(input);
-    }
-    function _toPropertyKey(arg) {
-        var key = _toPrimitive(arg, "string");
-        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
-    }
-    function _defineProperties(target, props) {
-        for (var i = 0; i < props.length; i++) {
-            var descriptor = props[i];
-            descriptor.enumerable = descriptor.enumerable || false;
-            descriptor.configurable = true;
-            if ("value" in descriptor) descriptor.writable = true;
-            Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
-        }
-    }
-    function _createClass(Constructor, protoProps, staticProps) {
-        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
-        if (staticProps) _defineProperties(Constructor, staticProps);
-        Object.defineProperty(Constructor, "prototype", {
-            writable: false
-        });
-        return Constructor;
-    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -3452,6 +3504,26 @@ module.exports = {
         });
         if (superClass) _setPrototypeOf(subClass, superClass);
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _toPropertyKey;
+    }));
+    var esm_typeof = __webpack_require__(2);
+    function _toPrimitive(input, hint) {
+        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
+        var prim = input[Symbol.toPrimitive];
+        if (prim !== undefined) {
+            var res = prim.call(input, hint || "default");
+            if (Object(esm_typeof["a"])(res) !== "object") return res;
+            throw new TypeError("@@toPrimitive must return a primitive value.");
+        }
+        return (hint === "string" ? String : Number)(input);
+    }
+    function _toPropertyKey(arg) {
+        var key = _toPrimitive(arg, "string");
+        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
+    }
 } ] ]);
 "
 `;
@@ -3470,10 +3542,25 @@ require("./vendors");
 require("./taro");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 4 ], {
-    11: function(module, exports, __webpack_require__) {},
-    15: function(module, __webpack_exports__, __webpack_require__) {
+    12: function(module, exports, __webpack_require__) {},
+    16: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
+        var toPropertyKey = __webpack_require__(7);
+        function _defineProperty(obj, key, value) {
+            key = Object(toPropertyKey["a"])(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         var mocks_taro = "taro";
         function mergeReconciler() {}
         function mergeInternalComponents() {}
@@ -3885,7 +3972,7 @@ require("./taro");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -3895,10 +3982,12 @@ require("./taro");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -3967,17 +4056,30 @@ require("./taro");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, undefined(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
         mergeInternalComponents(components);
         var taro_runtime = __webpack_require__(0);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(1);
-        var app = __webpack_require__(11);
+        var app = __webpack_require__(12);
         var app_App = function(_Component) {
             Object(inherits["a"])(App, _Component);
             var _super = Object(createSuper["a"])(App);
@@ -4003,7 +4105,7 @@ require("./taro");
             return App;
         }(react["Component"]);
         var lib_origin_app = app_App;
-        var taro_react = __webpack_require__(8);
+        var taro_react = __webpack_require__(9);
         var config = {
             pages: [ "pages/index/index" ],
             window: {
@@ -4027,7 +4129,7 @@ require("./taro");
             targetUnit: undefined
         });
     }
-}, [ [ 15, 0, 1, 3, 2 ] ] ]);
+}, [ [ 16, 0, 1, 3, 2 ] ] ]);
 
 
 
@@ -4764,13 +4866,13 @@ require("./taro");
 
 /** filePath: dist/comp.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 6 ], {
-    12: function(module, __webpack_exports__, __webpack_require__) {
+    13: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var _tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(0);
         Component(Object(_tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__["createRecursiveComponentConfig"])());
     }
-}, [ [ 12, 0, 1 ] ] ]);
+}, [ [ 13, 0, 1 ] ] ]);
 
 /** filePath: dist/comp.json **/
 {"component":true,"usingComponents":{"comp":"./comp"}}
@@ -4786,24 +4888,24 @@ I m irrelevant.
 
 /** filePath: dist/pages/index/index.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 8 ], {
-    14: function(module, exports, __webpack_require__) {},
-    16: function(module, __webpack_exports__, __webpack_require__) {
+    15: function(module, exports, __webpack_require__) {},
+    17: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(0);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(1);
-        var taro_components = __webpack_require__(7);
+        var taro_components = __webpack_require__(8);
         function say() {
             console.log("little cat");
         }
         function miao() {
             console.log("say: ", say());
         }
-        var index = __webpack_require__(14);
+        var index = __webpack_require__(15);
         var index_Index = function(_Component) {
             Object(inherits["a"])(Index, _Component);
             var _super = Object(createSuper["a"])(Index);
@@ -4836,7 +4938,7 @@ I m irrelevant.
         }, config || {}));
         var pages_index = __webpack_exports__["default"] = index_Index;
     }
-}, [ [ 16, 0, 1, 3, 2 ] ] ]);
+}, [ [ 17, 0, 1, 3, 2 ] ] ]);
 
 /** filePath: dist/pages/index/index.json **/
 {"navigationBarTitleText":"首页","usingComponents":{"comp":"../../comp"}}
@@ -4857,11 +4959,11 @@ I m irrelevant.
         "use strict";
         var _unused_webpack_default_export = "taro-runtime-mock";
     },
-    7: function(module, __webpack_exports__, __webpack_require__) {
+    8: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         var _unused_webpack_default_export = "taro-components-mock";
     },
-    8: function(module, __webpack_exports__, __webpack_require__) {
+    9: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_exports__["a"] = "taro-react-mock";
     }
@@ -4932,6 +5034,29 @@ module.exports = {
             throw new TypeError("Cannot call a class as a function");
         }
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _createClass;
+    }));
+    var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(7);
+    function _defineProperties(target, props) {
+        for (var i = 0; i < props.length; i++) {
+            var descriptor = props[i];
+            descriptor.enumerable = descriptor.enumerable || false;
+            descriptor.configurable = true;
+            if ("value" in descriptor) descriptor.writable = true;
+            Object.defineProperty(target, Object(_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["a"])(descriptor.key), descriptor);
+        }
+    }
+    function _createClass(Constructor, protoProps, staticProps) {
+        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+        if (staticProps) _defineProperties(Constructor, staticProps);
+        Object.defineProperty(Constructor, "prototype", {
+            writable: false
+        });
+        return Constructor;
+    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -4982,43 +5107,6 @@ module.exports = {
             return _possibleConstructorReturn(this, result);
         };
     }
-}, function(module, __webpack_exports__, __webpack_require__) {
-    "use strict";
-    __webpack_require__.d(__webpack_exports__, "a", (function() {
-        return _createClass;
-    }));
-    var esm_typeof = __webpack_require__(2);
-    function _toPrimitive(input, hint) {
-        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
-        var prim = input[Symbol.toPrimitive];
-        if (prim !== undefined) {
-            var res = prim.call(input, hint || "default");
-            if (Object(esm_typeof["a"])(res) !== "object") return res;
-            throw new TypeError("@@toPrimitive must return a primitive value.");
-        }
-        return (hint === "string" ? String : Number)(input);
-    }
-    function _toPropertyKey(arg) {
-        var key = _toPrimitive(arg, "string");
-        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
-    }
-    function _defineProperties(target, props) {
-        for (var i = 0; i < props.length; i++) {
-            var descriptor = props[i];
-            descriptor.enumerable = descriptor.enumerable || false;
-            descriptor.configurable = true;
-            if ("value" in descriptor) descriptor.writable = true;
-            Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
-        }
-    }
-    function _createClass(Constructor, protoProps, staticProps) {
-        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
-        if (staticProps) _defineProperties(Constructor, staticProps);
-        Object.defineProperty(Constructor, "prototype", {
-            writable: false
-        });
-        return Constructor;
-    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -5047,6 +5135,26 @@ module.exports = {
         });
         if (superClass) _setPrototypeOf(subClass, superClass);
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _toPropertyKey;
+    }));
+    var esm_typeof = __webpack_require__(2);
+    function _toPrimitive(input, hint) {
+        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
+        var prim = input[Symbol.toPrimitive];
+        if (prim !== undefined) {
+            var res = prim.call(input, hint || "default");
+            if (Object(esm_typeof["a"])(res) !== "object") return res;
+            throw new TypeError("@@toPrimitive must return a primitive value.");
+        }
+        return (hint === "string" ? String : Number)(input);
+    }
+    function _toPropertyKey(arg) {
+        var key = _toPrimitive(arg, "string");
+        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
+    }
 } ] ]);
 
 /** filePath: dist/weapp/index.wxml **/
diff --git a/packages/taro-mini-runner/src/__tests__/__snapshots__/css-modules.spec.ts.snap b/packages/taro-mini-runner/src/__tests__/__snapshots__/css-modules.spec.ts.snap
index 53f7545cf19..caeec10f652 100644
--- a/packages/taro-mini-runner/src/__tests__/__snapshots__/css-modules.spec.ts.snap
+++ b/packages/taro-mini-runner/src/__tests__/__snapshots__/css-modules.spec.ts.snap
@@ -14,12 +14,27 @@ require("./vendors");
 require("./taro");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 4 ], {
-    13: function(module, exports, __webpack_require__) {
+    14: function(module, exports, __webpack_require__) {
         module.exports = {};
     },
-    17: function(module, __webpack_exports__, __webpack_require__) {
+    18: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
+        var toPropertyKey = __webpack_require__(7);
+        function _defineProperty(obj, key, value) {
+            key = Object(toPropertyKey["a"])(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         var mocks_taro = "taro";
         function mergeReconciler() {}
         function mergeInternalComponents() {}
@@ -431,7 +446,7 @@ require("./taro");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -441,10 +456,12 @@ require("./taro");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -513,17 +530,30 @@ require("./taro");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, undefined(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
         mergeInternalComponents(components);
         var taro_runtime = __webpack_require__(0);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(1);
-        var app = __webpack_require__(13);
+        var app = __webpack_require__(14);
         var app_App = function(_Component) {
             Object(inherits["a"])(App, _Component);
             var _super = Object(createSuper["a"])(App);
@@ -549,7 +579,7 @@ require("./taro");
             return App;
         }(react["Component"]);
         var lib_src_app = app_App;
-        var taro_react = __webpack_require__(9);
+        var taro_react = __webpack_require__(10);
         var config = {
             pages: [ "pages/index/index" ],
             window: {
@@ -573,7 +603,7 @@ require("./taro");
             targetUnit: undefined
         });
     }
-}, [ [ 17, 0, 1, 3, 2 ] ] ]);
+}, [ [ 18, 0, 1, 3, 2 ] ] ]);
 
 
 
@@ -1310,13 +1340,13 @@ require("./taro");
 
 /** filePath: dist/comp.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 6 ], {
-    14: function(module, __webpack_exports__, __webpack_require__) {
+    15: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var _tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(0);
         Component(Object(_tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__["createRecursiveComponentConfig"])());
     }
-}, [ [ 14, 0, 1 ] ] ]);
+}, [ [ 15, 0, 1 ] ] ]);
 
 /** filePath: dist/comp.json **/
 {"component":true,"usingComponents":{"comp":"./comp"}}
@@ -1328,27 +1358,27 @@ require("./taro");
 
 /** filePath: dist/pages/index/index.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 8 ], {
-    10: function(module, exports, __webpack_require__) {
+    11: function(module, exports, __webpack_require__) {
         module.exports = {
             cwrapper: "index__cwrapper___bFOj1"
         };
     },
-    16: function(module, exports, __webpack_require__) {},
-    18: function(module, __webpack_exports__, __webpack_require__) {
+    17: function(module, exports, __webpack_require__) {},
+    19: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(0);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(1);
-        var taro_components = __webpack_require__(7);
-        var index_module = __webpack_require__(8);
+        var taro_components = __webpack_require__(8);
+        var index_module = __webpack_require__(9);
         var index_module_default = __webpack_require__.n(index_module);
-        var index = __webpack_require__(10);
+        var index = __webpack_require__(11);
         var index_default = __webpack_require__.n(index);
-        var index_global = __webpack_require__(16);
+        var index_global = __webpack_require__(17);
         var index_Index = function(_Component) {
             Object(inherits["a"])(Index, _Component);
             var _super = Object(createSuper["a"])(Index);
@@ -1390,13 +1420,13 @@ require("./taro");
         }, config || {}));
         var pages_index = __webpack_exports__["default"] = index_Index;
     },
-    8: function(module, exports, __webpack_require__) {
+    9: function(module, exports, __webpack_require__) {
         module.exports = {
             cbody: "index-module__cbody___7MNr8",
             ctext: "index-module__ctext___Oge7c"
         };
     }
-}, [ [ 18, 0, 1, 3, 2 ] ] ]);
+}, [ [ 19, 0, 1, 3, 2 ] ] ]);
 
 /** filePath: dist/pages/index/index.json **/
 {"navigationBarTitleText":"首页","usingComponents":{"comp":"../../comp"}}
@@ -1417,13 +1447,13 @@ require("./taro");
         "use strict";
         var _unused_webpack_default_export = "taro-runtime-mock";
     },
-    7: function(module, __webpack_exports__, __webpack_require__) {
+    10: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
-        var _unused_webpack_default_export = "taro-components-mock";
+        __webpack_exports__["a"] = "taro-react-mock";
     },
-    9: function(module, __webpack_exports__, __webpack_require__) {
+    8: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
-        __webpack_exports__["a"] = "taro-react-mock";
+        var _unused_webpack_default_export = "taro-components-mock";
     }
 } ]);
 
@@ -1492,6 +1522,29 @@ module.exports = {
             throw new TypeError("Cannot call a class as a function");
         }
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _createClass;
+    }));
+    var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(7);
+    function _defineProperties(target, props) {
+        for (var i = 0; i < props.length; i++) {
+            var descriptor = props[i];
+            descriptor.enumerable = descriptor.enumerable || false;
+            descriptor.configurable = true;
+            if ("value" in descriptor) descriptor.writable = true;
+            Object.defineProperty(target, Object(_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["a"])(descriptor.key), descriptor);
+        }
+    }
+    function _createClass(Constructor, protoProps, staticProps) {
+        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+        if (staticProps) _defineProperties(Constructor, staticProps);
+        Object.defineProperty(Constructor, "prototype", {
+            writable: false
+        });
+        return Constructor;
+    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -1542,43 +1595,6 @@ module.exports = {
             return _possibleConstructorReturn(this, result);
         };
     }
-}, function(module, __webpack_exports__, __webpack_require__) {
-    "use strict";
-    __webpack_require__.d(__webpack_exports__, "a", (function() {
-        return _createClass;
-    }));
-    var esm_typeof = __webpack_require__(2);
-    function _toPrimitive(input, hint) {
-        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
-        var prim = input[Symbol.toPrimitive];
-        if (prim !== undefined) {
-            var res = prim.call(input, hint || "default");
-            if (Object(esm_typeof["a"])(res) !== "object") return res;
-            throw new TypeError("@@toPrimitive must return a primitive value.");
-        }
-        return (hint === "string" ? String : Number)(input);
-    }
-    function _toPropertyKey(arg) {
-        var key = _toPrimitive(arg, "string");
-        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
-    }
-    function _defineProperties(target, props) {
-        for (var i = 0; i < props.length; i++) {
-            var descriptor = props[i];
-            descriptor.enumerable = descriptor.enumerable || false;
-            descriptor.configurable = true;
-            if ("value" in descriptor) descriptor.writable = true;
-            Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
-        }
-    }
-    function _createClass(Constructor, protoProps, staticProps) {
-        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
-        if (staticProps) _defineProperties(Constructor, staticProps);
-        Object.defineProperty(Constructor, "prototype", {
-            writable: false
-        });
-        return Constructor;
-    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -1607,6 +1623,26 @@ module.exports = {
         });
         if (superClass) _setPrototypeOf(subClass, superClass);
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _toPropertyKey;
+    }));
+    var esm_typeof = __webpack_require__(2);
+    function _toPrimitive(input, hint) {
+        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
+        var prim = input[Symbol.toPrimitive];
+        if (prim !== undefined) {
+            var res = prim.call(input, hint || "default");
+            if (Object(esm_typeof["a"])(res) !== "object") return res;
+            throw new TypeError("@@toPrimitive must return a primitive value.");
+        }
+        return (hint === "string" ? String : Number)(input);
+    }
+    function _toPropertyKey(arg) {
+        var key = _toPrimitive(arg, "string");
+        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
+    }
 } ] ]);
 "
 `;
@@ -1625,10 +1661,25 @@ require("./vendors");
 require("./taro");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 4 ], {
-    13: function(module, exports, __webpack_require__) {},
-    17: function(module, __webpack_exports__, __webpack_require__) {
+    14: function(module, exports, __webpack_require__) {},
+    18: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
+        var toPropertyKey = __webpack_require__(7);
+        function _defineProperty(obj, key, value) {
+            key = Object(toPropertyKey["a"])(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         var mocks_taro = "taro";
         function mergeReconciler() {}
         function mergeInternalComponents() {}
@@ -2040,7 +2091,7 @@ require("./taro");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -2050,10 +2101,12 @@ require("./taro");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -2122,17 +2175,30 @@ require("./taro");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, undefined(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
         mergeInternalComponents(components);
         var taro_runtime = __webpack_require__(0);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(1);
-        var app = __webpack_require__(13);
+        var app = __webpack_require__(14);
         var app_App = function(_Component) {
             Object(inherits["a"])(App, _Component);
             var _super = Object(createSuper["a"])(App);
@@ -2158,7 +2224,7 @@ require("./taro");
             return App;
         }(react["Component"]);
         var lib_src_app = app_App;
-        var taro_react = __webpack_require__(9);
+        var taro_react = __webpack_require__(10);
         var config = {
             pages: [ "pages/index/index" ],
             window: {
@@ -2182,7 +2248,7 @@ require("./taro");
             targetUnit: undefined
         });
     }
-}, [ [ 17, 0, 1, 3, 2 ] ] ]);
+}, [ [ 18, 0, 1, 3, 2 ] ] ]);
 
 
 
@@ -2919,13 +2985,13 @@ require("./taro");
 
 /** filePath: dist/comp.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 6 ], {
-    14: function(module, __webpack_exports__, __webpack_require__) {
+    15: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var _tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(0);
         Component(Object(_tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__["createRecursiveComponentConfig"])());
     }
-}, [ [ 14, 0, 1 ] ] ]);
+}, [ [ 15, 0, 1 ] ] ]);
 
 /** filePath: dist/comp.json **/
 {"component":true,"usingComponents":{"comp":"./comp"}}
@@ -2937,23 +3003,23 @@ require("./taro");
 
 /** filePath: dist/pages/index/index.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 8 ], {
-    10: function(module, exports, __webpack_require__) {},
-    16: function(module, exports, __webpack_require__) {},
-    18: function(module, __webpack_exports__, __webpack_require__) {
+    11: function(module, exports, __webpack_require__) {},
+    17: function(module, exports, __webpack_require__) {},
+    19: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(0);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(1);
-        var taro_components = __webpack_require__(7);
-        var index_module = __webpack_require__(8);
+        var taro_components = __webpack_require__(8);
+        var index_module = __webpack_require__(9);
         var index_module_default = __webpack_require__.n(index_module);
-        var index = __webpack_require__(10);
+        var index = __webpack_require__(11);
         var index_default = __webpack_require__.n(index);
-        var index_global = __webpack_require__(16);
+        var index_global = __webpack_require__(17);
         var index_Index = function(_Component) {
             Object(inherits["a"])(Index, _Component);
             var _super = Object(createSuper["a"])(Index);
@@ -2995,13 +3061,13 @@ require("./taro");
         }, config || {}));
         var pages_index = __webpack_exports__["default"] = index_Index;
     },
-    8: function(module, exports, __webpack_require__) {
+    9: function(module, exports, __webpack_require__) {
         module.exports = {
             cbody: "index-module__cbody___7MNr8",
             ctext: "index-module__ctext___Oge7c"
         };
     }
-}, [ [ 18, 0, 1, 3, 2 ] ] ]);
+}, [ [ 19, 0, 1, 3, 2 ] ] ]);
 
 /** filePath: dist/pages/index/index.json **/
 {"navigationBarTitleText":"首页","usingComponents":{"comp":"../../comp"}}
@@ -3022,13 +3088,13 @@ require("./taro");
         "use strict";
         var _unused_webpack_default_export = "taro-runtime-mock";
     },
-    7: function(module, __webpack_exports__, __webpack_require__) {
+    10: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
-        var _unused_webpack_default_export = "taro-components-mock";
+        __webpack_exports__["a"] = "taro-react-mock";
     },
-    9: function(module, __webpack_exports__, __webpack_require__) {
+    8: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
-        __webpack_exports__["a"] = "taro-react-mock";
+        var _unused_webpack_default_export = "taro-components-mock";
     }
 } ]);
 
@@ -3097,6 +3163,29 @@ module.exports = {
             throw new TypeError("Cannot call a class as a function");
         }
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _createClass;
+    }));
+    var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(7);
+    function _defineProperties(target, props) {
+        for (var i = 0; i < props.length; i++) {
+            var descriptor = props[i];
+            descriptor.enumerable = descriptor.enumerable || false;
+            descriptor.configurable = true;
+            if ("value" in descriptor) descriptor.writable = true;
+            Object.defineProperty(target, Object(_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["a"])(descriptor.key), descriptor);
+        }
+    }
+    function _createClass(Constructor, protoProps, staticProps) {
+        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+        if (staticProps) _defineProperties(Constructor, staticProps);
+        Object.defineProperty(Constructor, "prototype", {
+            writable: false
+        });
+        return Constructor;
+    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -3147,43 +3236,6 @@ module.exports = {
             return _possibleConstructorReturn(this, result);
         };
     }
-}, function(module, __webpack_exports__, __webpack_require__) {
-    "use strict";
-    __webpack_require__.d(__webpack_exports__, "a", (function() {
-        return _createClass;
-    }));
-    var esm_typeof = __webpack_require__(2);
-    function _toPrimitive(input, hint) {
-        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
-        var prim = input[Symbol.toPrimitive];
-        if (prim !== undefined) {
-            var res = prim.call(input, hint || "default");
-            if (Object(esm_typeof["a"])(res) !== "object") return res;
-            throw new TypeError("@@toPrimitive must return a primitive value.");
-        }
-        return (hint === "string" ? String : Number)(input);
-    }
-    function _toPropertyKey(arg) {
-        var key = _toPrimitive(arg, "string");
-        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
-    }
-    function _defineProperties(target, props) {
-        for (var i = 0; i < props.length; i++) {
-            var descriptor = props[i];
-            descriptor.enumerable = descriptor.enumerable || false;
-            descriptor.configurable = true;
-            if ("value" in descriptor) descriptor.writable = true;
-            Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
-        }
-    }
-    function _createClass(Constructor, protoProps, staticProps) {
-        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
-        if (staticProps) _defineProperties(Constructor, staticProps);
-        Object.defineProperty(Constructor, "prototype", {
-            writable: false
-        });
-        return Constructor;
-    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -3212,6 +3264,26 @@ module.exports = {
         });
         if (superClass) _setPrototypeOf(subClass, superClass);
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _toPropertyKey;
+    }));
+    var esm_typeof = __webpack_require__(2);
+    function _toPrimitive(input, hint) {
+        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
+        var prim = input[Symbol.toPrimitive];
+        if (prim !== undefined) {
+            var res = prim.call(input, hint || "default");
+            if (Object(esm_typeof["a"])(res) !== "object") return res;
+            throw new TypeError("@@toPrimitive must return a primitive value.");
+        }
+        return (hint === "string" ? String : Number)(input);
+    }
+    function _toPropertyKey(arg) {
+        var key = _toPrimitive(arg, "string");
+        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
+    }
 } ] ]);
 "
 `;
diff --git a/packages/taro-mini-runner/src/__tests__/__snapshots__/custom-tabbar.spec.ts.snap b/packages/taro-mini-runner/src/__tests__/__snapshots__/custom-tabbar.spec.ts.snap
index 5ef4800b72b..908347d1b1d 100644
--- a/packages/taro-mini-runner/src/__tests__/__snapshots__/custom-tabbar.spec.ts.snap
+++ b/packages/taro-mini-runner/src/__tests__/__snapshots__/custom-tabbar.spec.ts.snap
@@ -14,11 +14,26 @@ require("./vendors");
 require("./taro");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 4 ], {
-    14: function(module, exports, __webpack_require__) {},
-    18: function(module, __webpack_exports__, __webpack_require__) {
+    15: function(module, exports, __webpack_require__) {},
+    19: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
-        var mocks_taro = __webpack_require__(3);
+        var toPropertyKey = __webpack_require__(9);
+        function _defineProperty(obj, key, value) {
+            key = Object(toPropertyKey["a"])(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
+        var mocks_taro = __webpack_require__(2);
         var needPromiseApis = new Set([ "addFileToFavorites", "addVideoToFavorites", "authPrivateMessage", "checkIsAddedToMyMiniProgram", "chooseContact", "cropImage", "disableAlertBeforeUnload", "editImage", "enableAlertBeforeUnload", "getBackgroundFetchData", "getChannelsLiveInfo", "getChannelsLiveNoticeInfo", "getFuzzyLocation", "getGroupEnterInfo", "getLocalIPAddress", "getShareInfo", "getUserProfile", "getWeRunData", "join1v1Chat", "openChannelsActivity", "openChannelsEvent", "openChannelsLive", "openChannelsUserProfile", "openCustomerServiceChat", "openVideoEditor", "saveFileToDisk", "scanItem", "setEnable1v1Chat", "setWindowSize", "sendBizRedPacket", "startFacialRecognitionVerify" ]);
         function initNativeApi(taro) {
             Object(mocks_taro["f"])(taro, wx, {
@@ -392,7 +407,7 @@ require("./taro");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -402,10 +417,12 @@ require("./taro");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -474,17 +491,30 @@ require("./taro");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, Object(mocks_taro["toCamelCase"])(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         Object(mocks_taro["e"])(hostConfig);
         Object(mocks_taro["d"])(components);
         var taro_runtime = __webpack_require__(1);
         var classCallCheck = __webpack_require__(4);
-        var createClass = __webpack_require__(6);
+        var createClass = __webpack_require__(5);
         var inherits = __webpack_require__(7);
-        var createSuper = __webpack_require__(5);
+        var createSuper = __webpack_require__(6);
         var react = __webpack_require__(0);
-        var app = __webpack_require__(14);
+        var app = __webpack_require__(15);
         var app_App = function(_Component) {
             Object(inherits["a"])(App, _Component);
             var _super = Object(createSuper["a"])(App);
@@ -510,7 +540,7 @@ require("./taro");
             return App;
         }(react["Component"]);
         var lib_src_app = app_App;
-        var taro_react = __webpack_require__(9);
+        var taro_react = __webpack_require__(10);
         var config = {
             pages: [ "pages/index/index", "pages/detail/index" ],
             window: {
@@ -552,7 +582,7 @@ require("./taro");
             targetUnit: undefined
         });
     }
-}, [ [ 18, 0, 1, 3, 2 ] ] ]);
+}, [ [ 19, 0, 1, 3, 2 ] ] ]);
 
 
 
@@ -1447,7 +1477,7 @@ h�hځ��r������Nb2��х��K~��>;;ːL�1
     "use strict";
     __webpack_require__.r(__webpack_exports__);
     __webpack_exports__["default"] = "react-mock";
-}, , , function(module, __webpack_exports__, __webpack_require__) {
+}, , function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "e", (function() {
         return mergeReconciler;
@@ -1503,13 +1533,13 @@ h�hځ��r������Nb2��х��K~��>;;ːL�1
 
 /** filePath: dist/comp.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 6 ], {
-    15: function(module, __webpack_exports__, __webpack_require__) {
+    16: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var _tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(1);
         Component(Object(_tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__["createRecursiveComponentConfig"])());
     }
-}, [ [ 15, 0, 1 ] ] ]);
+}, [ [ 16, 0, 1 ] ] ]);
 
 /** filePath: dist/comp.json **/
 {"component":true,"usingComponents":{"comp":"./comp"}}
@@ -1521,19 +1551,19 @@ h�hځ��r������Nb2��х��K~��>;;ːL�1
 
 /** filePath: dist/custom-tab-bar/index.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 7 ], {
-    17: function(module, exports, __webpack_require__) {},
-    21: function(module, __webpack_exports__, __webpack_require__) {
+    18: function(module, exports, __webpack_require__) {},
+    22: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(1);
         var classCallCheck = __webpack_require__(4);
-        var createClass = __webpack_require__(6);
+        var createClass = __webpack_require__(5);
         var inherits = __webpack_require__(7);
-        var createSuper = __webpack_require__(5);
+        var createSuper = __webpack_require__(6);
         var react = __webpack_require__(0);
-        var taro_components = __webpack_require__(2);
-        var taro = __webpack_require__(3);
-        var custom_tab_bar = __webpack_require__(17);
+        var taro_components = __webpack_require__(3);
+        var taro = __webpack_require__(2);
+        var custom_tab_bar = __webpack_require__(18);
         var custom_tab_bar_Index = function(_Component) {
             Object(inherits["a"])(Index, _Component);
             var _super = Object(createSuper["a"])(Index);
@@ -1570,7 +1600,7 @@ h�hځ��r������Nb2��х��K~��>;;ːL�1
         var inst = Component(Object(taro_runtime["createComponentConfig"])(custom_tab_bar_Index, "custom-tab-bar/index"));
         var src_custom_tab_bar = __webpack_exports__["default"] = custom_tab_bar_Index;
     }
-}, [ [ 21, 0, 1, 3, 2 ] ] ]);
+}, [ [ 22, 0, 1, 3, 2 ] ] ]);
 
 /** filePath: dist/custom-tab-bar/index.json **/
 {}
@@ -1584,16 +1614,16 @@ h�hځ��r������Nb2��х��K~��>;;ːL�1
 
 /** filePath: dist/pages/detail/index.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 10 ], {
-    20: function(module, __webpack_exports__, __webpack_require__) {
+    21: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(1);
         var classCallCheck = __webpack_require__(4);
-        var createClass = __webpack_require__(6);
+        var createClass = __webpack_require__(5);
         var inherits = __webpack_require__(7);
-        var createSuper = __webpack_require__(5);
+        var createSuper = __webpack_require__(6);
         var react = __webpack_require__(0);
-        var taro_components = __webpack_require__(2);
+        var taro_components = __webpack_require__(3);
         var detail_Index = function(_Component) {
             Object(inherits["a"])(Index, _Component);
             var _super = Object(createSuper["a"])(Index);
@@ -1621,7 +1651,7 @@ h�hځ��r������Nb2��х��K~��>;;ːL�1
         }, config || {}));
         var detail = __webpack_exports__["default"] = detail_Index;
     }
-}, [ [ 20, 0, 1, 3, 2 ] ] ]);
+}, [ [ 21, 0, 1, 3, 2 ] ] ]);
 
 /** filePath: dist/pages/detail/index.json **/
 {"navigationBarTitleText":"详情页","usingComponents":{"comp":"../../comp"}}
@@ -1632,16 +1662,16 @@ h�hځ��r������Nb2��х��K~��>;;ːL�1
 
 /** filePath: dist/pages/index/index.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 12 ], {
-    19: function(module, __webpack_exports__, __webpack_require__) {
+    20: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(1);
         var classCallCheck = __webpack_require__(4);
-        var createClass = __webpack_require__(6);
+        var createClass = __webpack_require__(5);
         var inherits = __webpack_require__(7);
-        var createSuper = __webpack_require__(5);
+        var createSuper = __webpack_require__(6);
         var react = __webpack_require__(0);
-        var taro_components = __webpack_require__(2);
+        var taro_components = __webpack_require__(3);
         var index_Index = function(_Component) {
             Object(inherits["a"])(Index, _Component);
             var _super = Object(createSuper["a"])(Index);
@@ -1669,7 +1699,7 @@ h�hځ��r������Nb2��х��K~��>;;ːL�1
         }, config || {}));
         var index = __webpack_exports__["default"] = index_Index;
     }
-}, [ [ 19, 0, 1, 3, 2 ] ] ]);
+}, [ [ 20, 0, 1, 3, 2 ] ] ]);
 
 /** filePath: dist/pages/index/index.json **/
 {"navigationBarTitleText":"首页","usingComponents":{"comp":"../../comp"}}
@@ -1687,13 +1717,13 @@ h�hځ��r������Nb2��х��K~��>;;ːL�1
         "use strict";
         var _unused_webpack_default_export = "taro-runtime-mock";
     },
-    2: function(module, __webpack_exports__, __webpack_require__) {
+    10: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
-        var _unused_webpack_default_export = "taro-components-mock";
+        __webpack_exports__["a"] = "taro-react-mock";
     },
-    9: function(module, __webpack_exports__, __webpack_require__) {
+    3: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
-        __webpack_exports__["a"] = "taro-react-mock";
+        var _unused_webpack_default_export = "taro-components-mock";
     }
 } ]);
 
@@ -1749,6 +1779,29 @@ module.exports = {
             throw new TypeError("Cannot call a class as a function");
         }
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _createClass;
+    }));
+    var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(9);
+    function _defineProperties(target, props) {
+        for (var i = 0; i < props.length; i++) {
+            var descriptor = props[i];
+            descriptor.enumerable = descriptor.enumerable || false;
+            descriptor.configurable = true;
+            if ("value" in descriptor) descriptor.writable = true;
+            Object.defineProperty(target, Object(_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["a"])(descriptor.key), descriptor);
+        }
+    }
+    function _createClass(Constructor, protoProps, staticProps) {
+        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+        if (staticProps) _defineProperties(Constructor, staticProps);
+        Object.defineProperty(Constructor, "prototype", {
+            writable: false
+        });
+        return Constructor;
+    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -1799,43 +1852,6 @@ module.exports = {
             return _possibleConstructorReturn(this, result);
         };
     }
-}, function(module, __webpack_exports__, __webpack_require__) {
-    "use strict";
-    __webpack_require__.d(__webpack_exports__, "a", (function() {
-        return _createClass;
-    }));
-    var esm_typeof = __webpack_require__(8);
-    function _toPrimitive(input, hint) {
-        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
-        var prim = input[Symbol.toPrimitive];
-        if (prim !== undefined) {
-            var res = prim.call(input, hint || "default");
-            if (Object(esm_typeof["a"])(res) !== "object") return res;
-            throw new TypeError("@@toPrimitive must return a primitive value.");
-        }
-        return (hint === "string" ? String : Number)(input);
-    }
-    function _toPropertyKey(arg) {
-        var key = _toPrimitive(arg, "string");
-        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
-    }
-    function _defineProperties(target, props) {
-        for (var i = 0; i < props.length; i++) {
-            var descriptor = props[i];
-            descriptor.enumerable = descriptor.enumerable || false;
-            descriptor.configurable = true;
-            if ("value" in descriptor) descriptor.writable = true;
-            Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
-        }
-    }
-    function _createClass(Constructor, protoProps, staticProps) {
-        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
-        if (staticProps) _defineProperties(Constructor, staticProps);
-        Object.defineProperty(Constructor, "prototype", {
-            writable: false
-        });
-        return Constructor;
-    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -1877,6 +1893,26 @@ module.exports = {
             return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
         }, _typeof(obj);
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _toPropertyKey;
+    }));
+    var esm_typeof = __webpack_require__(8);
+    function _toPrimitive(input, hint) {
+        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
+        var prim = input[Symbol.toPrimitive];
+        if (prim !== undefined) {
+            var res = prim.call(input, hint || "default");
+            if (Object(esm_typeof["a"])(res) !== "object") return res;
+            throw new TypeError("@@toPrimitive must return a primitive value.");
+        }
+        return (hint === "string" ? String : Number)(input);
+    }
+    function _toPropertyKey(arg) {
+        var key = _toPrimitive(arg, "string");
+        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
+    }
 } ] ]);
 "
 `;
diff --git a/packages/taro-mini-runner/src/__tests__/__snapshots__/parse-html.spec.ts.snap b/packages/taro-mini-runner/src/__tests__/__snapshots__/parse-html.spec.ts.snap
index d04559fd08a..342f5805fd1 100644
--- a/packages/taro-mini-runner/src/__tests__/__snapshots__/parse-html.spec.ts.snap
+++ b/packages/taro-mini-runner/src/__tests__/__snapshots__/parse-html.spec.ts.snap
@@ -14,10 +14,25 @@ require("./vendors");
 require("./taro");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 4 ], {
-    11: function(module, exports, __webpack_require__) {},
-    15: function(module, __webpack_exports__, __webpack_require__) {
+    12: function(module, exports, __webpack_require__) {},
+    16: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
+        var toPropertyKey = __webpack_require__(7);
+        function _defineProperty(obj, key, value) {
+            key = Object(toPropertyKey["a"])(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         var mocks_taro = "taro";
         function mergeReconciler() {}
         function mergeInternalComponents() {}
@@ -429,7 +444,7 @@ require("./taro");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -439,10 +454,12 @@ require("./taro");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -511,17 +528,30 @@ require("./taro");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, undefined(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
         mergeInternalComponents(components);
         var taro_runtime = __webpack_require__(0);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(1);
-        var app = __webpack_require__(11);
+        var app = __webpack_require__(12);
         var app_App = function(_Component) {
             Object(inherits["a"])(App, _Component);
             var _super = Object(createSuper["a"])(App);
@@ -547,7 +577,7 @@ require("./taro");
             return App;
         }(react["Component"]);
         var lib_src_app = app_App;
-        var taro_react = __webpack_require__(8);
+        var taro_react = __webpack_require__(9);
         var config = {
             pages: [ "pages/index/index" ],
             window: {
@@ -571,7 +601,7 @@ require("./taro");
             targetUnit: undefined
         });
     }
-}, [ [ 15, 0, 1, 3, 2 ] ] ]);
+}, [ [ 16, 0, 1, 3, 2 ] ] ]);
 
 
 
@@ -1308,13 +1338,13 @@ require("./taro");
 
 /** filePath: dist/comp.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 6 ], {
-    12: function(module, __webpack_exports__, __webpack_require__) {
+    13: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var _tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(0);
         Component(Object(_tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__["createRecursiveComponentConfig"])());
     }
-}, [ [ 12, 0, 1 ] ] ]);
+}, [ [ 13, 0, 1 ] ] ]);
 
 /** filePath: dist/comp.json **/
 {"component":true,"usingComponents":{"comp":"./comp"}}
@@ -1326,18 +1356,18 @@ require("./taro");
 
 /** filePath: dist/pages/index/index.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 8 ], {
-    14: function(module, exports, __webpack_require__) {},
-    16: function(module, __webpack_exports__, __webpack_require__) {
+    15: function(module, exports, __webpack_require__) {},
+    17: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(0);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(1);
-        var taro_components = __webpack_require__(7);
-        var index = __webpack_require__(14);
+        var taro_components = __webpack_require__(8);
+        var index = __webpack_require__(15);
         var index_Index = function(_Component) {
             Object(inherits["a"])(Index, _Component);
             var _super = Object(createSuper["a"])(Index);
@@ -1370,7 +1400,7 @@ require("./taro");
         }, config || {}));
         var pages_index = __webpack_exports__["default"] = index_Index;
     }
-}, [ [ 16, 0, 1, 3, 2 ] ] ]);
+}, [ [ 17, 0, 1, 3, 2 ] ] ]);
 
 /** filePath: dist/pages/index/index.json **/
 {"navigationBarTitleText":"首页","usingComponents":{"comp":"../../comp"}}
@@ -1391,11 +1421,11 @@ require("./taro");
         "use strict";
         var _unused_webpack_default_export = "taro-runtime-mock";
     },
-    7: function(module, __webpack_exports__, __webpack_require__) {
+    8: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         var _unused_webpack_default_export = "taro-components-mock";
     },
-    8: function(module, __webpack_exports__, __webpack_require__) {
+    9: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_exports__["a"] = "taro-react-mock";
     }
@@ -1466,6 +1496,29 @@ module.exports = {
             throw new TypeError("Cannot call a class as a function");
         }
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _createClass;
+    }));
+    var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(7);
+    function _defineProperties(target, props) {
+        for (var i = 0; i < props.length; i++) {
+            var descriptor = props[i];
+            descriptor.enumerable = descriptor.enumerable || false;
+            descriptor.configurable = true;
+            if ("value" in descriptor) descriptor.writable = true;
+            Object.defineProperty(target, Object(_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["a"])(descriptor.key), descriptor);
+        }
+    }
+    function _createClass(Constructor, protoProps, staticProps) {
+        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+        if (staticProps) _defineProperties(Constructor, staticProps);
+        Object.defineProperty(Constructor, "prototype", {
+            writable: false
+        });
+        return Constructor;
+    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -1516,43 +1569,6 @@ module.exports = {
             return _possibleConstructorReturn(this, result);
         };
     }
-}, function(module, __webpack_exports__, __webpack_require__) {
-    "use strict";
-    __webpack_require__.d(__webpack_exports__, "a", (function() {
-        return _createClass;
-    }));
-    var esm_typeof = __webpack_require__(2);
-    function _toPrimitive(input, hint) {
-        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
-        var prim = input[Symbol.toPrimitive];
-        if (prim !== undefined) {
-            var res = prim.call(input, hint || "default");
-            if (Object(esm_typeof["a"])(res) !== "object") return res;
-            throw new TypeError("@@toPrimitive must return a primitive value.");
-        }
-        return (hint === "string" ? String : Number)(input);
-    }
-    function _toPropertyKey(arg) {
-        var key = _toPrimitive(arg, "string");
-        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
-    }
-    function _defineProperties(target, props) {
-        for (var i = 0; i < props.length; i++) {
-            var descriptor = props[i];
-            descriptor.enumerable = descriptor.enumerable || false;
-            descriptor.configurable = true;
-            if ("value" in descriptor) descriptor.writable = true;
-            Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
-        }
-    }
-    function _createClass(Constructor, protoProps, staticProps) {
-        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
-        if (staticProps) _defineProperties(Constructor, staticProps);
-        Object.defineProperty(Constructor, "prototype", {
-            writable: false
-        });
-        return Constructor;
-    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -1581,6 +1597,26 @@ module.exports = {
         });
         if (superClass) _setPrototypeOf(subClass, superClass);
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _toPropertyKey;
+    }));
+    var esm_typeof = __webpack_require__(2);
+    function _toPrimitive(input, hint) {
+        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
+        var prim = input[Symbol.toPrimitive];
+        if (prim !== undefined) {
+            var res = prim.call(input, hint || "default");
+            if (Object(esm_typeof["a"])(res) !== "object") return res;
+            throw new TypeError("@@toPrimitive must return a primitive value.");
+        }
+        return (hint === "string" ? String : Number)(input);
+    }
+    function _toPropertyKey(arg) {
+        var key = _toPrimitive(arg, "string");
+        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
+    }
 } ] ]);
 "
 `;
diff --git a/packages/taro-mini-runner/src/__tests__/__snapshots__/prerender.spec.ts.snap b/packages/taro-mini-runner/src/__tests__/__snapshots__/prerender.spec.ts.snap
index f2d07697cd3..8dfdb8f7f28 100644
--- a/packages/taro-mini-runner/src/__tests__/__snapshots__/prerender.spec.ts.snap
+++ b/packages/taro-mini-runner/src/__tests__/__snapshots__/prerender.spec.ts.snap
@@ -18,6 +18,7 @@ require("./taro");
     18: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
+        var defineProperty = __webpack_require__(3);
         var mocks_taro = "taro";
         function mergeReconciler() {}
         function mergeInternalComponents() {}
@@ -429,7 +430,7 @@ require("./taro");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -439,10 +440,12 @@ require("./taro");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -511,15 +514,28 @@ require("./taro");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(Object(defineProperty["a"])({}, undefined(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, Object(defineProperty["a"])(_ref, "v", ""), Object(defineProperty["a"])(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
         mergeInternalComponents(components);
         var taro_runtime = __webpack_require__(2);
-        var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(4);
-        var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(5);
+        var classCallCheck = __webpack_require__(4);
+        var createClass = __webpack_require__(5);
+        var inherits = __webpack_require__(7);
+        var createSuper = __webpack_require__(6);
         var react = __webpack_require__(0);
         var app = __webpack_require__(14);
         var app_App = function(_Component) {
@@ -1344,12 +1360,12 @@ require("./taro");
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(2);
-        var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(4);
-        var assertThisInitialized = __webpack_require__(7);
-        var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(5);
-        var defineProperty = __webpack_require__(9);
+        var classCallCheck = __webpack_require__(4);
+        var createClass = __webpack_require__(5);
+        var assertThisInitialized = __webpack_require__(8);
+        var inherits = __webpack_require__(7);
+        var createSuper = __webpack_require__(6);
+        var defineProperty = __webpack_require__(3);
         var react = __webpack_require__(0);
         var taro_components = __webpack_require__(1);
         var region = [ {
@@ -2636,12 +2652,12 @@ require("./taro");
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(2);
-        var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(4);
-        var assertThisInitialized = __webpack_require__(7);
-        var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(5);
-        var defineProperty = __webpack_require__(9);
+        var classCallCheck = __webpack_require__(4);
+        var createClass = __webpack_require__(5);
+        var assertThisInitialized = __webpack_require__(8);
+        var inherits = __webpack_require__(7);
+        var createSuper = __webpack_require__(6);
+        var defineProperty = __webpack_require__(3);
         var react = __webpack_require__(0);
         var taro_components = __webpack_require__(1);
         var normal_Index = function(_Component) {
@@ -2691,10 +2707,10 @@ require("./taro");
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(2);
-        var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(4);
-        var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(5);
+        var classCallCheck = __webpack_require__(4);
+        var createClass = __webpack_require__(5);
+        var inherits = __webpack_require__(7);
+        var createSuper = __webpack_require__(6);
         var react = __webpack_require__(0);
         var taro_components = __webpack_require__(1);
         var index = __webpack_require__(17);
@@ -2810,6 +2826,26 @@ module.exports = {
 
 /** filePath: dist/vendors.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 3 ], [ , , , function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _defineProperty;
+    }));
+    var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(10);
+    function _defineProperty(obj, key, value) {
+        key = Object(_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["a"])(key);
+        if (key in obj) {
+            Object.defineProperty(obj, key, {
+                value: value,
+                enumerable: true,
+                configurable: true,
+                writable: true
+            });
+        } else {
+            obj[key] = value;
+        }
+        return obj;
+    }
+}, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
         return _classCallCheck;
@@ -2864,8 +2900,8 @@ module.exports = {
             return false;
         }
     }
-    var esm_typeof = __webpack_require__(8);
-    var assertThisInitialized = __webpack_require__(7);
+    var esm_typeof = __webpack_require__(9);
+    var assertThisInitialized = __webpack_require__(8);
     function _possibleConstructorReturn(self, call) {
         if (call && (Object(esm_typeof["a"])(call) === "object" || typeof call === "function")) {
             return call;
@@ -2939,32 +2975,12 @@ module.exports = {
             return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
         }, _typeof(obj);
     }
-}, function(module, __webpack_exports__, __webpack_require__) {
-    "use strict";
-    __webpack_require__.d(__webpack_exports__, "a", (function() {
-        return _defineProperty;
-    }));
-    var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(10);
-    function _defineProperty(obj, key, value) {
-        key = Object(_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["a"])(key);
-        if (key in obj) {
-            Object.defineProperty(obj, key, {
-                value: value,
-                enumerable: true,
-                configurable: true,
-                writable: true
-            });
-        } else {
-            obj[key] = value;
-        }
-        return obj;
-    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
         return _toPropertyKey;
     }));
-    var esm_typeof = __webpack_require__(8);
+    var esm_typeof = __webpack_require__(9);
     function _toPrimitive(input, hint) {
         if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
         var prim = input[Symbol.toPrimitive];
@@ -3001,6 +3017,7 @@ require("./taro");
     18: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
+        var defineProperty = __webpack_require__(3);
         var mocks_taro = "taro";
         function mergeReconciler() {}
         function mergeInternalComponents() {}
@@ -3412,7 +3429,7 @@ require("./taro");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -3422,10 +3439,12 @@ require("./taro");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -3494,15 +3513,28 @@ require("./taro");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(Object(defineProperty["a"])({}, undefined(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, Object(defineProperty["a"])(_ref, "v", ""), Object(defineProperty["a"])(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
         mergeInternalComponents(components);
         var taro_runtime = __webpack_require__(2);
-        var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(4);
-        var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(5);
+        var classCallCheck = __webpack_require__(4);
+        var createClass = __webpack_require__(5);
+        var inherits = __webpack_require__(7);
+        var createSuper = __webpack_require__(6);
         var react = __webpack_require__(0);
         var app = __webpack_require__(14);
         var app_App = function(_Component) {
@@ -4327,12 +4359,12 @@ require("./taro");
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(2);
-        var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(4);
-        var assertThisInitialized = __webpack_require__(7);
-        var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(5);
-        var defineProperty = __webpack_require__(9);
+        var classCallCheck = __webpack_require__(4);
+        var createClass = __webpack_require__(5);
+        var assertThisInitialized = __webpack_require__(8);
+        var inherits = __webpack_require__(7);
+        var createSuper = __webpack_require__(6);
+        var defineProperty = __webpack_require__(3);
         var react = __webpack_require__(0);
         var taro_components = __webpack_require__(1);
         var region = [ {
@@ -5619,12 +5651,12 @@ require("./taro");
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(2);
-        var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(4);
-        var assertThisInitialized = __webpack_require__(7);
-        var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(5);
-        var defineProperty = __webpack_require__(9);
+        var classCallCheck = __webpack_require__(4);
+        var createClass = __webpack_require__(5);
+        var assertThisInitialized = __webpack_require__(8);
+        var inherits = __webpack_require__(7);
+        var createSuper = __webpack_require__(6);
+        var defineProperty = __webpack_require__(3);
         var react = __webpack_require__(0);
         var taro_components = __webpack_require__(1);
         var normal_Index = function(_Component) {
@@ -5674,10 +5706,10 @@ require("./taro");
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(2);
-        var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(4);
-        var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(5);
+        var classCallCheck = __webpack_require__(4);
+        var createClass = __webpack_require__(5);
+        var inherits = __webpack_require__(7);
+        var createSuper = __webpack_require__(6);
         var react = __webpack_require__(0);
         var taro_components = __webpack_require__(1);
         var index = __webpack_require__(17);
@@ -5793,6 +5825,26 @@ module.exports = {
 
 /** filePath: dist/vendors.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 3 ], [ , , , function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _defineProperty;
+    }));
+    var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(10);
+    function _defineProperty(obj, key, value) {
+        key = Object(_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["a"])(key);
+        if (key in obj) {
+            Object.defineProperty(obj, key, {
+                value: value,
+                enumerable: true,
+                configurable: true,
+                writable: true
+            });
+        } else {
+            obj[key] = value;
+        }
+        return obj;
+    }
+}, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
         return _classCallCheck;
@@ -5847,8 +5899,8 @@ module.exports = {
             return false;
         }
     }
-    var esm_typeof = __webpack_require__(8);
-    var assertThisInitialized = __webpack_require__(7);
+    var esm_typeof = __webpack_require__(9);
+    var assertThisInitialized = __webpack_require__(8);
     function _possibleConstructorReturn(self, call) {
         if (call && (Object(esm_typeof["a"])(call) === "object" || typeof call === "function")) {
             return call;
@@ -5922,32 +5974,12 @@ module.exports = {
             return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
         }, _typeof(obj);
     }
-}, function(module, __webpack_exports__, __webpack_require__) {
-    "use strict";
-    __webpack_require__.d(__webpack_exports__, "a", (function() {
-        return _defineProperty;
-    }));
-    var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(10);
-    function _defineProperty(obj, key, value) {
-        key = Object(_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["a"])(key);
-        if (key in obj) {
-            Object.defineProperty(obj, key, {
-                value: value,
-                enumerable: true,
-                configurable: true,
-                writable: true
-            });
-        } else {
-            obj[key] = value;
-        }
-        return obj;
-    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
         return _toPropertyKey;
     }));
-    var esm_typeof = __webpack_require__(8);
+    var esm_typeof = __webpack_require__(9);
     function _toPrimitive(input, hint) {
         if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
         var prim = input[Symbol.toPrimitive];
@@ -5984,6 +6016,7 @@ require("./taro");
     18: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
+        var defineProperty = __webpack_require__(3);
         var mocks_taro = "taro";
         function mergeReconciler() {}
         function mergeInternalComponents() {}
@@ -6395,7 +6428,7 @@ require("./taro");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -6405,10 +6438,12 @@ require("./taro");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -6477,15 +6512,28 @@ require("./taro");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(Object(defineProperty["a"])({}, undefined(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, Object(defineProperty["a"])(_ref, "v", ""), Object(defineProperty["a"])(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
         mergeInternalComponents(components);
         var taro_runtime = __webpack_require__(2);
-        var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(4);
-        var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(5);
+        var classCallCheck = __webpack_require__(4);
+        var createClass = __webpack_require__(5);
+        var inherits = __webpack_require__(7);
+        var createSuper = __webpack_require__(6);
         var react = __webpack_require__(0);
         var app = __webpack_require__(14);
         var app_App = function(_Component) {
@@ -7310,12 +7358,12 @@ require("./taro");
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(2);
-        var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(4);
-        var assertThisInitialized = __webpack_require__(7);
-        var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(5);
-        var defineProperty = __webpack_require__(9);
+        var classCallCheck = __webpack_require__(4);
+        var createClass = __webpack_require__(5);
+        var assertThisInitialized = __webpack_require__(8);
+        var inherits = __webpack_require__(7);
+        var createSuper = __webpack_require__(6);
+        var defineProperty = __webpack_require__(3);
         var react = __webpack_require__(0);
         var taro_components = __webpack_require__(1);
         var region = [ {
@@ -8602,12 +8650,12 @@ require("./taro");
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(2);
-        var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(4);
-        var assertThisInitialized = __webpack_require__(7);
-        var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(5);
-        var defineProperty = __webpack_require__(9);
+        var classCallCheck = __webpack_require__(4);
+        var createClass = __webpack_require__(5);
+        var assertThisInitialized = __webpack_require__(8);
+        var inherits = __webpack_require__(7);
+        var createSuper = __webpack_require__(6);
+        var defineProperty = __webpack_require__(3);
         var react = __webpack_require__(0);
         var taro_components = __webpack_require__(1);
         var normal_Index = function(_Component) {
@@ -8657,10 +8705,10 @@ require("./taro");
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(2);
-        var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(4);
-        var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(5);
+        var classCallCheck = __webpack_require__(4);
+        var createClass = __webpack_require__(5);
+        var inherits = __webpack_require__(7);
+        var createSuper = __webpack_require__(6);
         var react = __webpack_require__(0);
         var taro_components = __webpack_require__(1);
         var index = __webpack_require__(17);
@@ -8776,6 +8824,26 @@ module.exports = {
 
 /** filePath: dist/vendors.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 3 ], [ , , , function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _defineProperty;
+    }));
+    var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(10);
+    function _defineProperty(obj, key, value) {
+        key = Object(_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["a"])(key);
+        if (key in obj) {
+            Object.defineProperty(obj, key, {
+                value: value,
+                enumerable: true,
+                configurable: true,
+                writable: true
+            });
+        } else {
+            obj[key] = value;
+        }
+        return obj;
+    }
+}, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
         return _classCallCheck;
@@ -8830,8 +8898,8 @@ module.exports = {
             return false;
         }
     }
-    var esm_typeof = __webpack_require__(8);
-    var assertThisInitialized = __webpack_require__(7);
+    var esm_typeof = __webpack_require__(9);
+    var assertThisInitialized = __webpack_require__(8);
     function _possibleConstructorReturn(self, call) {
         if (call && (Object(esm_typeof["a"])(call) === "object" || typeof call === "function")) {
             return call;
@@ -8905,32 +8973,12 @@ module.exports = {
             return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
         }, _typeof(obj);
     }
-}, function(module, __webpack_exports__, __webpack_require__) {
-    "use strict";
-    __webpack_require__.d(__webpack_exports__, "a", (function() {
-        return _defineProperty;
-    }));
-    var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(10);
-    function _defineProperty(obj, key, value) {
-        key = Object(_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["a"])(key);
-        if (key in obj) {
-            Object.defineProperty(obj, key, {
-                value: value,
-                enumerable: true,
-                configurable: true,
-                writable: true
-            });
-        } else {
-            obj[key] = value;
-        }
-        return obj;
-    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
         return _toPropertyKey;
     }));
-    var esm_typeof = __webpack_require__(8);
+    var esm_typeof = __webpack_require__(9);
     function _toPrimitive(input, hint) {
         if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
         var prim = input[Symbol.toPrimitive];
diff --git a/packages/taro-mini-runner/src/__tests__/__snapshots__/qq.spec.ts.snap b/packages/taro-mini-runner/src/__tests__/__snapshots__/qq.spec.ts.snap
index c840936c4bb..f85b49eb1c7 100644
--- a/packages/taro-mini-runner/src/__tests__/__snapshots__/qq.spec.ts.snap
+++ b/packages/taro-mini-runner/src/__tests__/__snapshots__/qq.spec.ts.snap
@@ -14,8 +14,8 @@ require("./vendors");
 require("./taro");
 
 (qq["webpackJsonp"] = qq["webpackJsonp"] || []).push([ [ 4 ], {
-    11: function(module, exports, __webpack_require__) {},
-    15: function(module, __webpack_exports__, __webpack_require__) {
+    12: function(module, exports, __webpack_require__) {},
+    16: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         function _arrayLikeToArray(arr, len) {
@@ -43,6 +43,21 @@ require("./taro");
         function _toConsumableArray(arr) {
             return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
         }
+        var toPropertyKey = __webpack_require__(8);
+        function _defineProperty(obj, key, value) {
+            key = Object(toPropertyKey["a"])(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         var mocks_taro = "taro";
         function mergeReconciler() {}
         function mergeInternalComponents() {}
@@ -454,7 +469,7 @@ require("./taro");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -464,10 +479,12 @@ require("./taro");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -536,6 +553,19 @@ require("./taro");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, undefined(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         var asyncApis = new Set([ "getQQRunData", "requestWxPayment", "setAvatar", "shareInvite", "updateBookshelfReadTime" ]);
@@ -581,11 +611,11 @@ require("./taro");
         mergeInternalComponents(runtime_components);
         var taro_runtime = __webpack_require__(3);
         var classCallCheck = __webpack_require__(4);
-        var createClass = __webpack_require__(6);
+        var createClass = __webpack_require__(5);
         var inherits = __webpack_require__(7);
-        var createSuper = __webpack_require__(5);
+        var createSuper = __webpack_require__(6);
         var react = __webpack_require__(0);
-        var app = __webpack_require__(11);
+        var app = __webpack_require__(12);
         var app_App = function(_Component) {
             Object(inherits["a"])(App, _Component);
             var _super = Object(createSuper["a"])(App);
@@ -611,7 +641,7 @@ require("./taro");
             return App;
         }(react["Component"]);
         var lib_src_app = app_App;
-        var taro_react = __webpack_require__(8);
+        var taro_react = __webpack_require__(9);
         var config = {
             pages: [ "pages/index/index" ],
             window: {
@@ -635,7 +665,7 @@ require("./taro");
             targetUnit: undefined
         });
     }
-}, [ [ 15, 0, 1, 3, 2 ] ] ]);
+}, [ [ 16, 0, 1, 3, 2 ] ] ]);
 
 
 
@@ -1604,13 +1634,13 @@ require("./taro");
 
 /** filePath: dist/comp.js **/
 (qq["webpackJsonp"] = qq["webpackJsonp"] || []).push([ [ 6 ], {
-    12: function(module, __webpack_exports__, __webpack_require__) {
+    13: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var _tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(3);
         Component(Object(_tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__["createRecursiveComponentConfig"])());
     }
-}, [ [ 12, 0, 1 ] ] ]);
+}, [ [ 13, 0, 1 ] ] ]);
 
 /** filePath: dist/comp.json **/
 {"component":true,"usingComponents":{"comp":"./comp"}}
@@ -1623,8 +1653,8 @@ require("./taro");
 /** filePath: dist/pages/index/index.js **/
 /*! For license information please see index.js.LICENSE.txt */
 (qq["webpackJsonp"] = qq["webpackJsonp"] || []).push([ [ 8 ], {
-    14: function(module, exports, __webpack_require__) {},
-    16: function(module, __webpack_exports__, __webpack_require__) {
+    15: function(module, exports, __webpack_require__) {},
+    17: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(3);
@@ -1964,12 +1994,12 @@ require("./taro");
             };
         }
         var classCallCheck = __webpack_require__(4);
-        var createClass = __webpack_require__(6);
+        var createClass = __webpack_require__(5);
         var inherits = __webpack_require__(7);
-        var createSuper = __webpack_require__(5);
+        var createSuper = __webpack_require__(6);
         var react = __webpack_require__(0);
         var taro_components = __webpack_require__(1);
-        var index = __webpack_require__(14);
+        var index = __webpack_require__(15);
         var index_Index = function(_Component) {
             Object(inherits["a"])(Index, _Component);
             var _super = Object(createSuper["a"])(Index);
@@ -2035,7 +2065,7 @@ require("./taro");
         }, config || {}));
         var pages_index = __webpack_exports__["default"] = index_Index;
     }
-}, [ [ 16, 0, 1, 3, 2 ] ] ]);
+}, [ [ 17, 0, 1, 3, 2 ] ] ]);
 
 /** filePath: dist/pages/index/index.js.LICENSE.txt **/
 /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */
@@ -2064,7 +2094,7 @@ require("./taro");
         "use strict";
         var _unused_webpack_default_export = "taro-runtime-mock";
     },
-    8: function(module, __webpack_exports__, __webpack_require__) {
+    9: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_exports__["a"] = "taro-react-mock";
     }
@@ -2135,6 +2165,29 @@ module.exports = {
             throw new TypeError("Cannot call a class as a function");
         }
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _createClass;
+    }));
+    var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(8);
+    function _defineProperties(target, props) {
+        for (var i = 0; i < props.length; i++) {
+            var descriptor = props[i];
+            descriptor.enumerable = descriptor.enumerable || false;
+            descriptor.configurable = true;
+            if ("value" in descriptor) descriptor.writable = true;
+            Object.defineProperty(target, Object(_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["a"])(descriptor.key), descriptor);
+        }
+    }
+    function _createClass(Constructor, protoProps, staticProps) {
+        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+        if (staticProps) _defineProperties(Constructor, staticProps);
+        Object.defineProperty(Constructor, "prototype", {
+            writable: false
+        });
+        return Constructor;
+    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -2185,43 +2238,6 @@ module.exports = {
             return _possibleConstructorReturn(this, result);
         };
     }
-}, function(module, __webpack_exports__, __webpack_require__) {
-    "use strict";
-    __webpack_require__.d(__webpack_exports__, "a", (function() {
-        return _createClass;
-    }));
-    var esm_typeof = __webpack_require__(2);
-    function _toPrimitive(input, hint) {
-        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
-        var prim = input[Symbol.toPrimitive];
-        if (prim !== undefined) {
-            var res = prim.call(input, hint || "default");
-            if (Object(esm_typeof["a"])(res) !== "object") return res;
-            throw new TypeError("@@toPrimitive must return a primitive value.");
-        }
-        return (hint === "string" ? String : Number)(input);
-    }
-    function _toPropertyKey(arg) {
-        var key = _toPrimitive(arg, "string");
-        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
-    }
-    function _defineProperties(target, props) {
-        for (var i = 0; i < props.length; i++) {
-            var descriptor = props[i];
-            descriptor.enumerable = descriptor.enumerable || false;
-            descriptor.configurable = true;
-            if ("value" in descriptor) descriptor.writable = true;
-            Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
-        }
-    }
-    function _createClass(Constructor, protoProps, staticProps) {
-        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
-        if (staticProps) _defineProperties(Constructor, staticProps);
-        Object.defineProperty(Constructor, "prototype", {
-            writable: false
-        });
-        return Constructor;
-    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -2250,6 +2266,26 @@ module.exports = {
         });
         if (superClass) _setPrototypeOf(subClass, superClass);
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _toPropertyKey;
+    }));
+    var esm_typeof = __webpack_require__(2);
+    function _toPrimitive(input, hint) {
+        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
+        var prim = input[Symbol.toPrimitive];
+        if (prim !== undefined) {
+            var res = prim.call(input, hint || "default");
+            if (Object(esm_typeof["a"])(res) !== "object") return res;
+            throw new TypeError("@@toPrimitive must return a primitive value.");
+        }
+        return (hint === "string" ? String : Number)(input);
+    }
+    function _toPropertyKey(arg) {
+        var key = _toPrimitive(arg, "string");
+        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
+    }
 } ] ]);
 "
 `;
@@ -2268,8 +2304,8 @@ require("./vendors");
 require("./taro");
 
 (qq["webpackJsonp"] = qq["webpackJsonp"] || []).push([ [ 4 ], {
-    11: function(module, exports, __webpack_require__) {},
-    15: function(module, __webpack_exports__, __webpack_require__) {
+    12: function(module, exports, __webpack_require__) {},
+    16: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         function _arrayLikeToArray(arr, len) {
@@ -2297,6 +2333,21 @@ require("./taro");
         function _toConsumableArray(arr) {
             return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
         }
+        var toPropertyKey = __webpack_require__(8);
+        function _defineProperty(obj, key, value) {
+            key = Object(toPropertyKey["a"])(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         var mocks_taro = "taro";
         function mergeReconciler() {}
         function mergeInternalComponents() {}
@@ -2708,7 +2759,7 @@ require("./taro");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -2718,10 +2769,12 @@ require("./taro");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -2790,6 +2843,19 @@ require("./taro");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, undefined(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         var asyncApis = new Set([ "getQQRunData", "requestWxPayment", "setAvatar", "shareInvite", "updateBookshelfReadTime" ]);
@@ -2835,11 +2901,11 @@ require("./taro");
         mergeInternalComponents(runtime_components);
         var taro_runtime = __webpack_require__(3);
         var classCallCheck = __webpack_require__(4);
-        var createClass = __webpack_require__(6);
+        var createClass = __webpack_require__(5);
         var inherits = __webpack_require__(7);
-        var createSuper = __webpack_require__(5);
+        var createSuper = __webpack_require__(6);
         var react = __webpack_require__(0);
-        var app = __webpack_require__(11);
+        var app = __webpack_require__(12);
         var app_App = function(_Component) {
             Object(inherits["a"])(App, _Component);
             var _super = Object(createSuper["a"])(App);
@@ -2865,7 +2931,7 @@ require("./taro");
             return App;
         }(react["Component"]);
         var lib_src_app = app_App;
-        var taro_react = __webpack_require__(8);
+        var taro_react = __webpack_require__(9);
         var config = {
             pages: [ "pages/index/index" ],
             window: {
@@ -2889,7 +2955,7 @@ require("./taro");
             targetUnit: undefined
         });
     }
-}, [ [ 15, 0, 1, 3, 2 ] ] ]);
+}, [ [ 16, 0, 1, 3, 2 ] ] ]);
 
 
 
@@ -3858,13 +3924,13 @@ require("./taro");
 
 /** filePath: dist/comp.js **/
 (qq["webpackJsonp"] = qq["webpackJsonp"] || []).push([ [ 6 ], {
-    12: function(module, __webpack_exports__, __webpack_require__) {
+    13: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var _tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(3);
         Component(Object(_tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__["createRecursiveComponentConfig"])());
     }
-}, [ [ 12, 0, 1 ] ] ]);
+}, [ [ 13, 0, 1 ] ] ]);
 
 /** filePath: dist/comp.json **/
 {"component":true,"usingComponents":{"comp":"./comp"}}
@@ -3877,8 +3943,8 @@ require("./taro");
 /** filePath: dist/pages/index/index.js **/
 /*! For license information please see index.js.LICENSE.txt */
 (qq["webpackJsonp"] = qq["webpackJsonp"] || []).push([ [ 8 ], {
-    14: function(module, exports, __webpack_require__) {},
-    16: function(module, __webpack_exports__, __webpack_require__) {
+    15: function(module, exports, __webpack_require__) {},
+    17: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(3);
@@ -4218,12 +4284,12 @@ require("./taro");
             };
         }
         var classCallCheck = __webpack_require__(4);
-        var createClass = __webpack_require__(6);
+        var createClass = __webpack_require__(5);
         var inherits = __webpack_require__(7);
-        var createSuper = __webpack_require__(5);
+        var createSuper = __webpack_require__(6);
         var react = __webpack_require__(0);
         var taro_components = __webpack_require__(1);
-        var index = __webpack_require__(14);
+        var index = __webpack_require__(15);
         var index_Index = function(_Component) {
             Object(inherits["a"])(Index, _Component);
             var _super = Object(createSuper["a"])(Index);
@@ -4289,7 +4355,7 @@ require("./taro");
         }, config || {}));
         var pages_index = __webpack_exports__["default"] = index_Index;
     }
-}, [ [ 16, 0, 1, 3, 2 ] ] ]);
+}, [ [ 17, 0, 1, 3, 2 ] ] ]);
 
 /** filePath: dist/pages/index/index.js.LICENSE.txt **/
 /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */
@@ -4318,7 +4384,7 @@ require("./taro");
         "use strict";
         var _unused_webpack_default_export = "taro-runtime-mock";
     },
-    8: function(module, __webpack_exports__, __webpack_require__) {
+    9: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_exports__["a"] = "taro-react-mock";
     }
@@ -4389,6 +4455,29 @@ module.exports = {
             throw new TypeError("Cannot call a class as a function");
         }
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _createClass;
+    }));
+    var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(8);
+    function _defineProperties(target, props) {
+        for (var i = 0; i < props.length; i++) {
+            var descriptor = props[i];
+            descriptor.enumerable = descriptor.enumerable || false;
+            descriptor.configurable = true;
+            if ("value" in descriptor) descriptor.writable = true;
+            Object.defineProperty(target, Object(_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["a"])(descriptor.key), descriptor);
+        }
+    }
+    function _createClass(Constructor, protoProps, staticProps) {
+        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+        if (staticProps) _defineProperties(Constructor, staticProps);
+        Object.defineProperty(Constructor, "prototype", {
+            writable: false
+        });
+        return Constructor;
+    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -4439,43 +4528,6 @@ module.exports = {
             return _possibleConstructorReturn(this, result);
         };
     }
-}, function(module, __webpack_exports__, __webpack_require__) {
-    "use strict";
-    __webpack_require__.d(__webpack_exports__, "a", (function() {
-        return _createClass;
-    }));
-    var esm_typeof = __webpack_require__(2);
-    function _toPrimitive(input, hint) {
-        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
-        var prim = input[Symbol.toPrimitive];
-        if (prim !== undefined) {
-            var res = prim.call(input, hint || "default");
-            if (Object(esm_typeof["a"])(res) !== "object") return res;
-            throw new TypeError("@@toPrimitive must return a primitive value.");
-        }
-        return (hint === "string" ? String : Number)(input);
-    }
-    function _toPropertyKey(arg) {
-        var key = _toPrimitive(arg, "string");
-        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
-    }
-    function _defineProperties(target, props) {
-        for (var i = 0; i < props.length; i++) {
-            var descriptor = props[i];
-            descriptor.enumerable = descriptor.enumerable || false;
-            descriptor.configurable = true;
-            if ("value" in descriptor) descriptor.writable = true;
-            Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
-        }
-    }
-    function _createClass(Constructor, protoProps, staticProps) {
-        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
-        if (staticProps) _defineProperties(Constructor, staticProps);
-        Object.defineProperty(Constructor, "prototype", {
-            writable: false
-        });
-        return Constructor;
-    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -4504,6 +4556,26 @@ module.exports = {
         });
         if (superClass) _setPrototypeOf(subClass, superClass);
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _toPropertyKey;
+    }));
+    var esm_typeof = __webpack_require__(2);
+    function _toPrimitive(input, hint) {
+        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
+        var prim = input[Symbol.toPrimitive];
+        if (prim !== undefined) {
+            var res = prim.call(input, hint || "default");
+            if (Object(esm_typeof["a"])(res) !== "object") return res;
+            throw new TypeError("@@toPrimitive must return a primitive value.");
+        }
+        return (hint === "string" ? String : Number)(input);
+    }
+    function _toPropertyKey(arg) {
+        var key = _toPrimitive(arg, "string");
+        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
+    }
 } ] ]);
 "
 `;
diff --git a/packages/taro-mini-runner/src/__tests__/__snapshots__/react.spec.ts.snap b/packages/taro-mini-runner/src/__tests__/__snapshots__/react.spec.ts.snap
index fa22d09e3cd..bb0e9a7bab3 100644
--- a/packages/taro-mini-runner/src/__tests__/__snapshots__/react.spec.ts.snap
+++ b/packages/taro-mini-runner/src/__tests__/__snapshots__/react.spec.ts.snap
@@ -14,10 +14,25 @@ require("./vendors");
 require("./taro");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 4 ], {
-    11: function(module, exports, __webpack_require__) {},
-    15: function(module, __webpack_exports__, __webpack_require__) {
+    12: function(module, exports, __webpack_require__) {},
+    16: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
+        var toPropertyKey = __webpack_require__(8);
+        function _defineProperty(obj, key, value) {
+            key = Object(toPropertyKey["a"])(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         var mocks_taro = "taro";
         function mergeReconciler() {}
         function mergeInternalComponents() {}
@@ -429,7 +444,7 @@ require("./taro");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -439,10 +454,12 @@ require("./taro");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -511,17 +528,30 @@ require("./taro");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, undefined(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
         mergeInternalComponents(components);
         var taro_runtime = __webpack_require__(3);
         var classCallCheck = __webpack_require__(4);
-        var createClass = __webpack_require__(6);
+        var createClass = __webpack_require__(5);
         var inherits = __webpack_require__(7);
-        var createSuper = __webpack_require__(5);
+        var createSuper = __webpack_require__(6);
         var react = __webpack_require__(0);
-        var app = __webpack_require__(11);
+        var app = __webpack_require__(12);
         var app_App = function(_Component) {
             Object(inherits["a"])(App, _Component);
             var _super = Object(createSuper["a"])(App);
@@ -547,7 +577,7 @@ require("./taro");
             return App;
         }(react["Component"]);
         var lib_src_app = app_App;
-        var taro_react = __webpack_require__(8);
+        var taro_react = __webpack_require__(9);
         var config = {
             pages: [ "pages/index/index" ],
             window: {
@@ -571,7 +601,7 @@ require("./taro");
             targetUnit: undefined
         });
     }
-}, [ [ 15, 0, 1, 3, 2 ] ] ]);
+}, [ [ 16, 0, 1, 3, 2 ] ] ]);
 
 
 
@@ -1540,13 +1570,13 @@ require("./taro");
 
 /** filePath: dist/comp.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 6 ], {
-    12: function(module, __webpack_exports__, __webpack_require__) {
+    13: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var _tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(3);
         Component(Object(_tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__["createRecursiveComponentConfig"])());
     }
-}, [ [ 12, 0, 1 ] ] ]);
+}, [ [ 13, 0, 1 ] ] ]);
 
 /** filePath: dist/comp.json **/
 {"component":true,"usingComponents":{"comp":"./comp"}}
@@ -1559,8 +1589,8 @@ require("./taro");
 /** filePath: dist/pages/index/index.js **/
 /*! For license information please see index.js.LICENSE.txt */
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 8 ], {
-    14: function(module, exports, __webpack_require__) {},
-    16: function(module, __webpack_exports__, __webpack_require__) {
+    15: function(module, exports, __webpack_require__) {},
+    17: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(3);
@@ -1900,12 +1930,12 @@ require("./taro");
             };
         }
         var classCallCheck = __webpack_require__(4);
-        var createClass = __webpack_require__(6);
+        var createClass = __webpack_require__(5);
         var inherits = __webpack_require__(7);
-        var createSuper = __webpack_require__(5);
+        var createSuper = __webpack_require__(6);
         var react = __webpack_require__(0);
         var taro_components = __webpack_require__(1);
-        var index = __webpack_require__(14);
+        var index = __webpack_require__(15);
         var index_Index = function(_Component) {
             Object(inherits["a"])(Index, _Component);
             var _super = Object(createSuper["a"])(Index);
@@ -1971,7 +2001,7 @@ require("./taro");
         }, config || {}));
         var pages_index = __webpack_exports__["default"] = index_Index;
     }
-}, [ [ 16, 0, 1, 3, 2 ] ] ]);
+}, [ [ 17, 0, 1, 3, 2 ] ] ]);
 
 /** filePath: dist/pages/index/index.js.LICENSE.txt **/
 /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */
@@ -2000,7 +2030,7 @@ require("./taro");
         "use strict";
         var _unused_webpack_default_export = "taro-runtime-mock";
     },
-    8: function(module, __webpack_exports__, __webpack_require__) {
+    9: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_exports__["a"] = "taro-react-mock";
     }
@@ -2071,6 +2101,29 @@ module.exports = {
             throw new TypeError("Cannot call a class as a function");
         }
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _createClass;
+    }));
+    var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(8);
+    function _defineProperties(target, props) {
+        for (var i = 0; i < props.length; i++) {
+            var descriptor = props[i];
+            descriptor.enumerable = descriptor.enumerable || false;
+            descriptor.configurable = true;
+            if ("value" in descriptor) descriptor.writable = true;
+            Object.defineProperty(target, Object(_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["a"])(descriptor.key), descriptor);
+        }
+    }
+    function _createClass(Constructor, protoProps, staticProps) {
+        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+        if (staticProps) _defineProperties(Constructor, staticProps);
+        Object.defineProperty(Constructor, "prototype", {
+            writable: false
+        });
+        return Constructor;
+    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -2121,43 +2174,6 @@ module.exports = {
             return _possibleConstructorReturn(this, result);
         };
     }
-}, function(module, __webpack_exports__, __webpack_require__) {
-    "use strict";
-    __webpack_require__.d(__webpack_exports__, "a", (function() {
-        return _createClass;
-    }));
-    var esm_typeof = __webpack_require__(2);
-    function _toPrimitive(input, hint) {
-        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
-        var prim = input[Symbol.toPrimitive];
-        if (prim !== undefined) {
-            var res = prim.call(input, hint || "default");
-            if (Object(esm_typeof["a"])(res) !== "object") return res;
-            throw new TypeError("@@toPrimitive must return a primitive value.");
-        }
-        return (hint === "string" ? String : Number)(input);
-    }
-    function _toPropertyKey(arg) {
-        var key = _toPrimitive(arg, "string");
-        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
-    }
-    function _defineProperties(target, props) {
-        for (var i = 0; i < props.length; i++) {
-            var descriptor = props[i];
-            descriptor.enumerable = descriptor.enumerable || false;
-            descriptor.configurable = true;
-            if ("value" in descriptor) descriptor.writable = true;
-            Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
-        }
-    }
-    function _createClass(Constructor, protoProps, staticProps) {
-        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
-        if (staticProps) _defineProperties(Constructor, staticProps);
-        Object.defineProperty(Constructor, "prototype", {
-            writable: false
-        });
-        return Constructor;
-    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -2186,6 +2202,26 @@ module.exports = {
         });
         if (superClass) _setPrototypeOf(subClass, superClass);
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _toPropertyKey;
+    }));
+    var esm_typeof = __webpack_require__(2);
+    function _toPrimitive(input, hint) {
+        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
+        var prim = input[Symbol.toPrimitive];
+        if (prim !== undefined) {
+            var res = prim.call(input, hint || "default");
+            if (Object(esm_typeof["a"])(res) !== "object") return res;
+            throw new TypeError("@@toPrimitive must return a primitive value.");
+        }
+        return (hint === "string" ? String : Number)(input);
+    }
+    function _toPropertyKey(arg) {
+        var key = _toPrimitive(arg, "string");
+        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
+    }
 } ] ]);
 "
 `;
diff --git a/packages/taro-mini-runner/src/__tests__/__snapshots__/sass.spec.ts.snap b/packages/taro-mini-runner/src/__tests__/__snapshots__/sass.spec.ts.snap
index 83e5f9dc4c0..dfb377f5874 100644
--- a/packages/taro-mini-runner/src/__tests__/__snapshots__/sass.spec.ts.snap
+++ b/packages/taro-mini-runner/src/__tests__/__snapshots__/sass.spec.ts.snap
@@ -14,10 +14,25 @@ require("./vendors");
 require("./taro");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 4 ], {
-    11: function(module, exports, __webpack_require__) {},
-    15: function(module, __webpack_exports__, __webpack_require__) {
+    12: function(module, exports, __webpack_require__) {},
+    16: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
+        var toPropertyKey = __webpack_require__(7);
+        function _defineProperty(obj, key, value) {
+            key = Object(toPropertyKey["a"])(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         var mocks_taro = "taro";
         function mergeReconciler() {}
         function mergeInternalComponents() {}
@@ -429,7 +444,7 @@ require("./taro");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -439,10 +454,12 @@ require("./taro");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -511,17 +528,30 @@ require("./taro");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, undefined(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
         mergeInternalComponents(components);
         var taro_runtime = __webpack_require__(0);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(1);
-        var app = __webpack_require__(11);
+        var app = __webpack_require__(12);
         var app_App = function(_Component) {
             Object(inherits["a"])(App, _Component);
             var _super = Object(createSuper["a"])(App);
@@ -547,7 +577,7 @@ require("./taro");
             return App;
         }(react["Component"]);
         var lib_src_app = app_App;
-        var taro_react = __webpack_require__(8);
+        var taro_react = __webpack_require__(9);
         var config = {
             pages: [ "pages/index/index" ],
             window: {
@@ -571,7 +601,7 @@ require("./taro");
             targetUnit: undefined
         });
     }
-}, [ [ 15, 0, 1, 3, 2 ] ] ]);
+}, [ [ 16, 0, 1, 3, 2 ] ] ]);
 
 
 
@@ -1308,13 +1338,13 @@ require("./taro");
 
 /** filePath: dist/comp.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 6 ], {
-    12: function(module, __webpack_exports__, __webpack_require__) {
+    13: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var _tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(0);
         Component(Object(_tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__["createRecursiveComponentConfig"])());
     }
-}, [ [ 12, 0, 1 ] ] ]);
+}, [ [ 13, 0, 1 ] ] ]);
 
 /** filePath: dist/comp.json **/
 {"component":true,"usingComponents":{"comp":"./comp"}}
@@ -1326,18 +1356,18 @@ require("./taro");
 
 /** filePath: dist/pages/index/index.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 8 ], {
-    14: function(module, exports, __webpack_require__) {},
-    16: function(module, __webpack_exports__, __webpack_require__) {
+    15: function(module, exports, __webpack_require__) {},
+    17: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(0);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(1);
-        var taro_components = __webpack_require__(7);
-        var index = __webpack_require__(14);
+        var taro_components = __webpack_require__(8);
+        var index = __webpack_require__(15);
         var index_Index = function(_Component) {
             Object(inherits["a"])(Index, _Component);
             var _super = Object(createSuper["a"])(Index);
@@ -1377,7 +1407,7 @@ require("./taro");
         }, config || {}));
         var pages_index = __webpack_exports__["default"] = index_Index;
     }
-}, [ [ 16, 0, 1, 3, 2 ] ] ]);
+}, [ [ 17, 0, 1, 3, 2 ] ] ]);
 
 /** filePath: dist/pages/index/index.json **/
 {"navigationBarTitleText":"首页","usingComponents":{"comp":"../../comp"}}
@@ -1398,11 +1428,11 @@ require("./taro");
         "use strict";
         var _unused_webpack_default_export = "taro-runtime-mock";
     },
-    7: function(module, __webpack_exports__, __webpack_require__) {
+    8: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         var _unused_webpack_default_export = "taro-components-mock";
     },
-    8: function(module, __webpack_exports__, __webpack_require__) {
+    9: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_exports__["a"] = "taro-react-mock";
     }
@@ -1473,6 +1503,29 @@ module.exports = {
             throw new TypeError("Cannot call a class as a function");
         }
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _createClass;
+    }));
+    var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(7);
+    function _defineProperties(target, props) {
+        for (var i = 0; i < props.length; i++) {
+            var descriptor = props[i];
+            descriptor.enumerable = descriptor.enumerable || false;
+            descriptor.configurable = true;
+            if ("value" in descriptor) descriptor.writable = true;
+            Object.defineProperty(target, Object(_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["a"])(descriptor.key), descriptor);
+        }
+    }
+    function _createClass(Constructor, protoProps, staticProps) {
+        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+        if (staticProps) _defineProperties(Constructor, staticProps);
+        Object.defineProperty(Constructor, "prototype", {
+            writable: false
+        });
+        return Constructor;
+    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -1523,43 +1576,6 @@ module.exports = {
             return _possibleConstructorReturn(this, result);
         };
     }
-}, function(module, __webpack_exports__, __webpack_require__) {
-    "use strict";
-    __webpack_require__.d(__webpack_exports__, "a", (function() {
-        return _createClass;
-    }));
-    var esm_typeof = __webpack_require__(2);
-    function _toPrimitive(input, hint) {
-        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
-        var prim = input[Symbol.toPrimitive];
-        if (prim !== undefined) {
-            var res = prim.call(input, hint || "default");
-            if (Object(esm_typeof["a"])(res) !== "object") return res;
-            throw new TypeError("@@toPrimitive must return a primitive value.");
-        }
-        return (hint === "string" ? String : Number)(input);
-    }
-    function _toPropertyKey(arg) {
-        var key = _toPrimitive(arg, "string");
-        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
-    }
-    function _defineProperties(target, props) {
-        for (var i = 0; i < props.length; i++) {
-            var descriptor = props[i];
-            descriptor.enumerable = descriptor.enumerable || false;
-            descriptor.configurable = true;
-            if ("value" in descriptor) descriptor.writable = true;
-            Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
-        }
-    }
-    function _createClass(Constructor, protoProps, staticProps) {
-        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
-        if (staticProps) _defineProperties(Constructor, staticProps);
-        Object.defineProperty(Constructor, "prototype", {
-            writable: false
-        });
-        return Constructor;
-    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -1588,6 +1604,26 @@ module.exports = {
         });
         if (superClass) _setPrototypeOf(subClass, superClass);
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _toPropertyKey;
+    }));
+    var esm_typeof = __webpack_require__(2);
+    function _toPrimitive(input, hint) {
+        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
+        var prim = input[Symbol.toPrimitive];
+        if (prim !== undefined) {
+            var res = prim.call(input, hint || "default");
+            if (Object(esm_typeof["a"])(res) !== "object") return res;
+            throw new TypeError("@@toPrimitive must return a primitive value.");
+        }
+        return (hint === "string" ? String : Number)(input);
+    }
+    function _toPropertyKey(arg) {
+        var key = _toPrimitive(arg, "string");
+        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
+    }
 } ] ]);
 "
 `;
@@ -1606,10 +1642,25 @@ require("./vendors");
 require("./taro");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 4 ], {
-    11: function(module, exports, __webpack_require__) {},
-    15: function(module, __webpack_exports__, __webpack_require__) {
+    12: function(module, exports, __webpack_require__) {},
+    16: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
+        var toPropertyKey = __webpack_require__(7);
+        function _defineProperty(obj, key, value) {
+            key = Object(toPropertyKey["a"])(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         var mocks_taro = "taro";
         function mergeReconciler() {}
         function mergeInternalComponents() {}
@@ -2021,7 +2072,7 @@ require("./taro");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -2031,10 +2082,12 @@ require("./taro");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -2103,17 +2156,30 @@ require("./taro");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, undefined(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
         mergeInternalComponents(components);
         var taro_runtime = __webpack_require__(0);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(1);
-        var app = __webpack_require__(11);
+        var app = __webpack_require__(12);
         var app_App = function(_Component) {
             Object(inherits["a"])(App, _Component);
             var _super = Object(createSuper["a"])(App);
@@ -2139,7 +2205,7 @@ require("./taro");
             return App;
         }(react["Component"]);
         var lib_src_app = app_App;
-        var taro_react = __webpack_require__(8);
+        var taro_react = __webpack_require__(9);
         var config = {
             pages: [ "pages/index/index" ],
             window: {
@@ -2163,7 +2229,7 @@ require("./taro");
             targetUnit: undefined
         });
     }
-}, [ [ 15, 0, 1, 3, 2 ] ] ]);
+}, [ [ 16, 0, 1, 3, 2 ] ] ]);
 
 
 
@@ -2900,13 +2966,13 @@ require("./taro");
 
 /** filePath: dist/comp.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 6 ], {
-    12: function(module, __webpack_exports__, __webpack_require__) {
+    13: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var _tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(0);
         Component(Object(_tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__["createRecursiveComponentConfig"])());
     }
-}, [ [ 12, 0, 1 ] ] ]);
+}, [ [ 13, 0, 1 ] ] ]);
 
 /** filePath: dist/comp.json **/
 {"component":true,"usingComponents":{"comp":"./comp"}}
@@ -2918,18 +2984,18 @@ require("./taro");
 
 /** filePath: dist/pages/index/index.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 8 ], {
-    14: function(module, exports, __webpack_require__) {},
-    16: function(module, __webpack_exports__, __webpack_require__) {
+    15: function(module, exports, __webpack_require__) {},
+    17: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(0);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(1);
-        var taro_components = __webpack_require__(7);
-        var index = __webpack_require__(14);
+        var taro_components = __webpack_require__(8);
+        var index = __webpack_require__(15);
         var index_Index = function(_Component) {
             Object(inherits["a"])(Index, _Component);
             var _super = Object(createSuper["a"])(Index);
@@ -2969,7 +3035,7 @@ require("./taro");
         }, config || {}));
         var pages_index = __webpack_exports__["default"] = index_Index;
     }
-}, [ [ 16, 0, 1, 3, 2 ] ] ]);
+}, [ [ 17, 0, 1, 3, 2 ] ] ]);
 
 /** filePath: dist/pages/index/index.json **/
 {"navigationBarTitleText":"首页","usingComponents":{"comp":"../../comp"}}
@@ -2990,11 +3056,11 @@ require("./taro");
         "use strict";
         var _unused_webpack_default_export = "taro-runtime-mock";
     },
-    7: function(module, __webpack_exports__, __webpack_require__) {
+    8: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         var _unused_webpack_default_export = "taro-components-mock";
     },
-    8: function(module, __webpack_exports__, __webpack_require__) {
+    9: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_exports__["a"] = "taro-react-mock";
     }
@@ -3065,6 +3131,29 @@ module.exports = {
             throw new TypeError("Cannot call a class as a function");
         }
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _createClass;
+    }));
+    var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(7);
+    function _defineProperties(target, props) {
+        for (var i = 0; i < props.length; i++) {
+            var descriptor = props[i];
+            descriptor.enumerable = descriptor.enumerable || false;
+            descriptor.configurable = true;
+            if ("value" in descriptor) descriptor.writable = true;
+            Object.defineProperty(target, Object(_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["a"])(descriptor.key), descriptor);
+        }
+    }
+    function _createClass(Constructor, protoProps, staticProps) {
+        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+        if (staticProps) _defineProperties(Constructor, staticProps);
+        Object.defineProperty(Constructor, "prototype", {
+            writable: false
+        });
+        return Constructor;
+    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -3115,43 +3204,6 @@ module.exports = {
             return _possibleConstructorReturn(this, result);
         };
     }
-}, function(module, __webpack_exports__, __webpack_require__) {
-    "use strict";
-    __webpack_require__.d(__webpack_exports__, "a", (function() {
-        return _createClass;
-    }));
-    var esm_typeof = __webpack_require__(2);
-    function _toPrimitive(input, hint) {
-        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
-        var prim = input[Symbol.toPrimitive];
-        if (prim !== undefined) {
-            var res = prim.call(input, hint || "default");
-            if (Object(esm_typeof["a"])(res) !== "object") return res;
-            throw new TypeError("@@toPrimitive must return a primitive value.");
-        }
-        return (hint === "string" ? String : Number)(input);
-    }
-    function _toPropertyKey(arg) {
-        var key = _toPrimitive(arg, "string");
-        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
-    }
-    function _defineProperties(target, props) {
-        for (var i = 0; i < props.length; i++) {
-            var descriptor = props[i];
-            descriptor.enumerable = descriptor.enumerable || false;
-            descriptor.configurable = true;
-            if ("value" in descriptor) descriptor.writable = true;
-            Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
-        }
-    }
-    function _createClass(Constructor, protoProps, staticProps) {
-        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
-        if (staticProps) _defineProperties(Constructor, staticProps);
-        Object.defineProperty(Constructor, "prototype", {
-            writable: false
-        });
-        return Constructor;
-    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -3180,6 +3232,26 @@ module.exports = {
         });
         if (superClass) _setPrototypeOf(subClass, superClass);
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _toPropertyKey;
+    }));
+    var esm_typeof = __webpack_require__(2);
+    function _toPrimitive(input, hint) {
+        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
+        var prim = input[Symbol.toPrimitive];
+        if (prim !== undefined) {
+            var res = prim.call(input, hint || "default");
+            if (Object(esm_typeof["a"])(res) !== "object") return res;
+            throw new TypeError("@@toPrimitive must return a primitive value.");
+        }
+        return (hint === "string" ? String : Number)(input);
+    }
+    function _toPropertyKey(arg) {
+        var key = _toPrimitive(arg, "string");
+        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
+    }
 } ] ]);
 "
 `;
@@ -3198,10 +3270,25 @@ require("./vendors");
 require("./taro");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 4 ], {
-    11: function(module, exports, __webpack_require__) {},
-    15: function(module, __webpack_exports__, __webpack_require__) {
+    12: function(module, exports, __webpack_require__) {},
+    16: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
+        var toPropertyKey = __webpack_require__(7);
+        function _defineProperty(obj, key, value) {
+            key = Object(toPropertyKey["a"])(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         var mocks_taro = "taro";
         function mergeReconciler() {}
         function mergeInternalComponents() {}
@@ -3613,7 +3700,7 @@ require("./taro");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -3623,10 +3710,12 @@ require("./taro");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -3695,17 +3784,30 @@ require("./taro");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, undefined(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
         mergeInternalComponents(components);
         var taro_runtime = __webpack_require__(0);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(1);
-        var app = __webpack_require__(11);
+        var app = __webpack_require__(12);
         var app_App = function(_Component) {
             Object(inherits["a"])(App, _Component);
             var _super = Object(createSuper["a"])(App);
@@ -3731,7 +3833,7 @@ require("./taro");
             return App;
         }(react["Component"]);
         var lib_src_app = app_App;
-        var taro_react = __webpack_require__(8);
+        var taro_react = __webpack_require__(9);
         var config = {
             pages: [ "pages/index/index" ],
             window: {
@@ -3755,7 +3857,7 @@ require("./taro");
             targetUnit: undefined
         });
     }
-}, [ [ 15, 0, 1, 3, 2 ] ] ]);
+}, [ [ 16, 0, 1, 3, 2 ] ] ]);
 
 
 
@@ -4492,13 +4594,13 @@ require("./taro");
 
 /** filePath: dist/comp.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 6 ], {
-    12: function(module, __webpack_exports__, __webpack_require__) {
+    13: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var _tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(0);
         Component(Object(_tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__["createRecursiveComponentConfig"])());
     }
-}, [ [ 12, 0, 1 ] ] ]);
+}, [ [ 13, 0, 1 ] ] ]);
 
 /** filePath: dist/comp.json **/
 {"component":true,"usingComponents":{"comp":"./comp"}}
@@ -4510,18 +4612,18 @@ require("./taro");
 
 /** filePath: dist/pages/index/index.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 8 ], {
-    14: function(module, exports, __webpack_require__) {},
-    16: function(module, __webpack_exports__, __webpack_require__) {
+    15: function(module, exports, __webpack_require__) {},
+    17: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(0);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(1);
-        var taro_components = __webpack_require__(7);
-        var index = __webpack_require__(14);
+        var taro_components = __webpack_require__(8);
+        var index = __webpack_require__(15);
         var index_Index = function(_Component) {
             Object(inherits["a"])(Index, _Component);
             var _super = Object(createSuper["a"])(Index);
@@ -4561,7 +4663,7 @@ require("./taro");
         }, config || {}));
         var pages_index = __webpack_exports__["default"] = index_Index;
     }
-}, [ [ 16, 0, 1, 3, 2 ] ] ]);
+}, [ [ 17, 0, 1, 3, 2 ] ] ]);
 
 /** filePath: dist/pages/index/index.json **/
 {"navigationBarTitleText":"首页","usingComponents":{"comp":"../../comp"}}
@@ -4582,11 +4684,11 @@ require("./taro");
         "use strict";
         var _unused_webpack_default_export = "taro-runtime-mock";
     },
-    7: function(module, __webpack_exports__, __webpack_require__) {
+    8: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         var _unused_webpack_default_export = "taro-components-mock";
     },
-    8: function(module, __webpack_exports__, __webpack_require__) {
+    9: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_exports__["a"] = "taro-react-mock";
     }
@@ -4657,6 +4759,29 @@ module.exports = {
             throw new TypeError("Cannot call a class as a function");
         }
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _createClass;
+    }));
+    var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(7);
+    function _defineProperties(target, props) {
+        for (var i = 0; i < props.length; i++) {
+            var descriptor = props[i];
+            descriptor.enumerable = descriptor.enumerable || false;
+            descriptor.configurable = true;
+            if ("value" in descriptor) descriptor.writable = true;
+            Object.defineProperty(target, Object(_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["a"])(descriptor.key), descriptor);
+        }
+    }
+    function _createClass(Constructor, protoProps, staticProps) {
+        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+        if (staticProps) _defineProperties(Constructor, staticProps);
+        Object.defineProperty(Constructor, "prototype", {
+            writable: false
+        });
+        return Constructor;
+    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -4707,43 +4832,6 @@ module.exports = {
             return _possibleConstructorReturn(this, result);
         };
     }
-}, function(module, __webpack_exports__, __webpack_require__) {
-    "use strict";
-    __webpack_require__.d(__webpack_exports__, "a", (function() {
-        return _createClass;
-    }));
-    var esm_typeof = __webpack_require__(2);
-    function _toPrimitive(input, hint) {
-        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
-        var prim = input[Symbol.toPrimitive];
-        if (prim !== undefined) {
-            var res = prim.call(input, hint || "default");
-            if (Object(esm_typeof["a"])(res) !== "object") return res;
-            throw new TypeError("@@toPrimitive must return a primitive value.");
-        }
-        return (hint === "string" ? String : Number)(input);
-    }
-    function _toPropertyKey(arg) {
-        var key = _toPrimitive(arg, "string");
-        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
-    }
-    function _defineProperties(target, props) {
-        for (var i = 0; i < props.length; i++) {
-            var descriptor = props[i];
-            descriptor.enumerable = descriptor.enumerable || false;
-            descriptor.configurable = true;
-            if ("value" in descriptor) descriptor.writable = true;
-            Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
-        }
-    }
-    function _createClass(Constructor, protoProps, staticProps) {
-        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
-        if (staticProps) _defineProperties(Constructor, staticProps);
-        Object.defineProperty(Constructor, "prototype", {
-            writable: false
-        });
-        return Constructor;
-    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -4772,6 +4860,26 @@ module.exports = {
         });
         if (superClass) _setPrototypeOf(subClass, superClass);
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _toPropertyKey;
+    }));
+    var esm_typeof = __webpack_require__(2);
+    function _toPrimitive(input, hint) {
+        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
+        var prim = input[Symbol.toPrimitive];
+        if (prim !== undefined) {
+            var res = prim.call(input, hint || "default");
+            if (Object(esm_typeof["a"])(res) !== "object") return res;
+            throw new TypeError("@@toPrimitive must return a primitive value.");
+        }
+        return (hint === "string" ? String : Number)(input);
+    }
+    function _toPropertyKey(arg) {
+        var key = _toPrimitive(arg, "string");
+        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
+    }
 } ] ]);
 "
 `;
@@ -4790,10 +4898,25 @@ require("./vendors");
 require("./taro");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 4 ], {
-    11: function(module, exports, __webpack_require__) {},
-    15: function(module, __webpack_exports__, __webpack_require__) {
+    12: function(module, exports, __webpack_require__) {},
+    16: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
+        var toPropertyKey = __webpack_require__(7);
+        function _defineProperty(obj, key, value) {
+            key = Object(toPropertyKey["a"])(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         var mocks_taro = "taro";
         function mergeReconciler() {}
         function mergeInternalComponents() {}
@@ -5205,7 +5328,7 @@ require("./taro");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -5215,10 +5338,12 @@ require("./taro");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -5287,17 +5412,30 @@ require("./taro");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, undefined(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
         mergeInternalComponents(components);
         var taro_runtime = __webpack_require__(0);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(1);
-        var app = __webpack_require__(11);
+        var app = __webpack_require__(12);
         var app_App = function(_Component) {
             Object(inherits["a"])(App, _Component);
             var _super = Object(createSuper["a"])(App);
@@ -5323,7 +5461,7 @@ require("./taro");
             return App;
         }(react["Component"]);
         var lib_src_app = app_App;
-        var taro_react = __webpack_require__(8);
+        var taro_react = __webpack_require__(9);
         var config = {
             pages: [ "pages/index/index" ],
             window: {
@@ -5347,7 +5485,7 @@ require("./taro");
             targetUnit: undefined
         });
     }
-}, [ [ 15, 0, 1, 3, 2 ] ] ]);
+}, [ [ 16, 0, 1, 3, 2 ] ] ]);
 
 
 
@@ -6084,13 +6222,13 @@ require("./taro");
 
 /** filePath: dist/comp.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 6 ], {
-    12: function(module, __webpack_exports__, __webpack_require__) {
+    13: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var _tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(0);
         Component(Object(_tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__["createRecursiveComponentConfig"])());
     }
-}, [ [ 12, 0, 1 ] ] ]);
+}, [ [ 13, 0, 1 ] ] ]);
 
 /** filePath: dist/comp.json **/
 {"component":true,"usingComponents":{"comp":"./comp"}}
@@ -6102,18 +6240,18 @@ require("./taro");
 
 /** filePath: dist/pages/index/index.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 8 ], {
-    14: function(module, exports, __webpack_require__) {},
-    16: function(module, __webpack_exports__, __webpack_require__) {
+    15: function(module, exports, __webpack_require__) {},
+    17: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(0);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(1);
-        var taro_components = __webpack_require__(7);
-        var index = __webpack_require__(14);
+        var taro_components = __webpack_require__(8);
+        var index = __webpack_require__(15);
         var index_Index = function(_Component) {
             Object(inherits["a"])(Index, _Component);
             var _super = Object(createSuper["a"])(Index);
@@ -6153,7 +6291,7 @@ require("./taro");
         }, config || {}));
         var pages_index = __webpack_exports__["default"] = index_Index;
     }
-}, [ [ 16, 0, 1, 3, 2 ] ] ]);
+}, [ [ 17, 0, 1, 3, 2 ] ] ]);
 
 /** filePath: dist/pages/index/index.json **/
 {"navigationBarTitleText":"首页","usingComponents":{"comp":"../../comp"}}
@@ -6174,11 +6312,11 @@ require("./taro");
         "use strict";
         var _unused_webpack_default_export = "taro-runtime-mock";
     },
-    7: function(module, __webpack_exports__, __webpack_require__) {
+    8: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         var _unused_webpack_default_export = "taro-components-mock";
     },
-    8: function(module, __webpack_exports__, __webpack_require__) {
+    9: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_exports__["a"] = "taro-react-mock";
     }
@@ -6249,6 +6387,29 @@ module.exports = {
             throw new TypeError("Cannot call a class as a function");
         }
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _createClass;
+    }));
+    var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(7);
+    function _defineProperties(target, props) {
+        for (var i = 0; i < props.length; i++) {
+            var descriptor = props[i];
+            descriptor.enumerable = descriptor.enumerable || false;
+            descriptor.configurable = true;
+            if ("value" in descriptor) descriptor.writable = true;
+            Object.defineProperty(target, Object(_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["a"])(descriptor.key), descriptor);
+        }
+    }
+    function _createClass(Constructor, protoProps, staticProps) {
+        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+        if (staticProps) _defineProperties(Constructor, staticProps);
+        Object.defineProperty(Constructor, "prototype", {
+            writable: false
+        });
+        return Constructor;
+    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -6299,43 +6460,6 @@ module.exports = {
             return _possibleConstructorReturn(this, result);
         };
     }
-}, function(module, __webpack_exports__, __webpack_require__) {
-    "use strict";
-    __webpack_require__.d(__webpack_exports__, "a", (function() {
-        return _createClass;
-    }));
-    var esm_typeof = __webpack_require__(2);
-    function _toPrimitive(input, hint) {
-        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
-        var prim = input[Symbol.toPrimitive];
-        if (prim !== undefined) {
-            var res = prim.call(input, hint || "default");
-            if (Object(esm_typeof["a"])(res) !== "object") return res;
-            throw new TypeError("@@toPrimitive must return a primitive value.");
-        }
-        return (hint === "string" ? String : Number)(input);
-    }
-    function _toPropertyKey(arg) {
-        var key = _toPrimitive(arg, "string");
-        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
-    }
-    function _defineProperties(target, props) {
-        for (var i = 0; i < props.length; i++) {
-            var descriptor = props[i];
-            descriptor.enumerable = descriptor.enumerable || false;
-            descriptor.configurable = true;
-            if ("value" in descriptor) descriptor.writable = true;
-            Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
-        }
-    }
-    function _createClass(Constructor, protoProps, staticProps) {
-        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
-        if (staticProps) _defineProperties(Constructor, staticProps);
-        Object.defineProperty(Constructor, "prototype", {
-            writable: false
-        });
-        return Constructor;
-    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -6364,6 +6488,26 @@ module.exports = {
         });
         if (superClass) _setPrototypeOf(subClass, superClass);
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _toPropertyKey;
+    }));
+    var esm_typeof = __webpack_require__(2);
+    function _toPrimitive(input, hint) {
+        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
+        var prim = input[Symbol.toPrimitive];
+        if (prim !== undefined) {
+            var res = prim.call(input, hint || "default");
+            if (Object(esm_typeof["a"])(res) !== "object") return res;
+            throw new TypeError("@@toPrimitive must return a primitive value.");
+        }
+        return (hint === "string" ? String : Number)(input);
+    }
+    function _toPropertyKey(arg) {
+        var key = _toPrimitive(arg, "string");
+        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
+    }
 } ] ]);
 "
 `;
diff --git a/packages/taro-mini-runner/src/__tests__/__snapshots__/subpackages.spec.ts.snap b/packages/taro-mini-runner/src/__tests__/__snapshots__/subpackages.spec.ts.snap
index 2b89ac3cde3..b15121021e9 100644
--- a/packages/taro-mini-runner/src/__tests__/__snapshots__/subpackages.spec.ts.snap
+++ b/packages/taro-mini-runner/src/__tests__/__snapshots__/subpackages.spec.ts.snap
@@ -14,10 +14,25 @@ require("./vendors");
 require("./taro");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 5 ], {
-    15: function(module, exports, __webpack_require__) {},
-    19: function(module, __webpack_exports__, __webpack_require__) {
+    16: function(module, exports, __webpack_require__) {},
+    20: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
+        var toPropertyKey = __webpack_require__(10);
+        function _defineProperty(obj, key, value) {
+            key = Object(toPropertyKey["a"])(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         var mocks_taro = __webpack_require__(2);
         var needPromiseApis = new Set([ "addFileToFavorites", "addVideoToFavorites", "authPrivateMessage", "checkIsAddedToMyMiniProgram", "chooseContact", "cropImage", "disableAlertBeforeUnload", "editImage", "enableAlertBeforeUnload", "getBackgroundFetchData", "getChannelsLiveInfo", "getChannelsLiveNoticeInfo", "getFuzzyLocation", "getGroupEnterInfo", "getLocalIPAddress", "getShareInfo", "getUserProfile", "getWeRunData", "join1v1Chat", "openChannelsActivity", "openChannelsEvent", "openChannelsLive", "openChannelsUserProfile", "openCustomerServiceChat", "openVideoEditor", "saveFileToDisk", "scanItem", "setEnable1v1Chat", "setWindowSize", "sendBizRedPacket", "startFacialRecognitionVerify" ]);
         function initNativeApi(taro) {
@@ -392,7 +407,7 @@ require("./taro");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -402,10 +417,12 @@ require("./taro");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -474,17 +491,30 @@ require("./taro");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, Object(mocks_taro["toCamelCase"])(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         Object(mocks_taro["e"])(hostConfig);
         Object(mocks_taro["d"])(components);
         var taro_runtime = __webpack_require__(1);
         var classCallCheck = __webpack_require__(4);
-        var createClass = __webpack_require__(6);
+        var createClass = __webpack_require__(5);
         var inherits = __webpack_require__(7);
-        var createSuper = __webpack_require__(5);
+        var createSuper = __webpack_require__(6);
         var react = __webpack_require__(0);
-        var app = __webpack_require__(15);
+        var app = __webpack_require__(16);
         var app_App = function(_Component) {
             Object(inherits["a"])(App, _Component);
             var _super = Object(createSuper["a"])(App);
@@ -510,7 +540,7 @@ require("./taro");
             return App;
         }(react["Component"]);
         var lib_src_app = app_App;
-        var taro_react = __webpack_require__(10);
+        var taro_react = __webpack_require__(11);
         var config = {
             pages: [ "pages/index/index" ],
             window: {
@@ -538,7 +568,7 @@ require("./taro");
             targetUnit: undefined
         });
     }
-}, [ [ 19, 0, 1, 3, 2 ] ] ]);
+}, [ [ 20, 0, 1, 3, 2 ] ] ]);
 
 
 
@@ -1327,13 +1357,13 @@ require("./taro");
 
 /** filePath: dist/comp.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 7 ], {
-    16: function(module, __webpack_exports__, __webpack_require__) {
+    17: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var _tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(1);
         Component(Object(_tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__["createRecursiveComponentConfig"])());
     }
-}, [ [ 16, 0, 1 ] ] ]);
+}, [ [ 17, 0, 1 ] ] ]);
 
 /** filePath: dist/comp.json **/
 {"component":true,"usingComponents":{"comp":"./comp"}}
@@ -1347,19 +1377,19 @@ require("./taro");
 require("../../sub-utils");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 9 ], {
-    18: function(module, exports, __webpack_require__) {},
-    21: function(module, __webpack_exports__, __webpack_require__) {
+    19: function(module, exports, __webpack_require__) {},
+    22: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(1);
         var classCallCheck = __webpack_require__(4);
-        var createClass = __webpack_require__(6);
+        var createClass = __webpack_require__(5);
         var inherits = __webpack_require__(7);
-        var createSuper = __webpack_require__(5);
+        var createSuper = __webpack_require__(6);
         var react = __webpack_require__(0);
         var taro_components = __webpack_require__(3);
         var common = __webpack_require__(9);
-        var detail = __webpack_require__(18);
+        var detail = __webpack_require__(19);
         var detail_Detail = function(_Component) {
             Object(inherits["a"])(Detail, _Component);
             var _super = Object(createSuper["a"])(Detail);
@@ -1392,7 +1422,7 @@ require("../../sub-utils");
         }, config || {}));
         var packageA_detail = __webpack_exports__["default"] = detail_Detail;
     }
-}, [ [ 21, 0, 4, 1, 3, 2 ] ] ]);
+}, [ [ 22, 0, 4, 1, 3, 2 ] ] ]);
 
 
 
@@ -1410,14 +1440,14 @@ require("../../sub-utils");
 require("../../sub-utils");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 11 ], {
-    22: function(module, __webpack_exports__, __webpack_require__) {
+    23: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(1);
         var classCallCheck = __webpack_require__(4);
-        var createClass = __webpack_require__(6);
+        var createClass = __webpack_require__(5);
         var inherits = __webpack_require__(7);
-        var createSuper = __webpack_require__(5);
+        var createSuper = __webpack_require__(6);
         var react = __webpack_require__(0);
         var taro_components = __webpack_require__(3);
         var common = __webpack_require__(9);
@@ -1451,7 +1481,7 @@ require("../../sub-utils");
         }, config || {}));
         var my = __webpack_exports__["default"] = my_My;
     }
-}, [ [ 22, 0, 4, 1, 3, 2 ] ] ]);
+}, [ [ 23, 0, 4, 1, 3, 2 ] ] ]);
 
 
 
@@ -1464,14 +1494,14 @@ require("../../sub-utils");
 
 /** filePath: dist/pages/index/index.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 13 ], {
-    20: function(module, __webpack_exports__, __webpack_require__) {
+    21: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(1);
         var classCallCheck = __webpack_require__(4);
-        var createClass = __webpack_require__(6);
+        var createClass = __webpack_require__(5);
         var inherits = __webpack_require__(7);
-        var createSuper = __webpack_require__(5);
+        var createSuper = __webpack_require__(6);
         var react = __webpack_require__(0);
         var taro_components = __webpack_require__(3);
         var taro = __webpack_require__(2);
@@ -1514,7 +1544,7 @@ require("../../sub-utils");
         }, config || {}));
         var index = __webpack_exports__["default"] = index_Index;
     }
-}, [ [ 20, 0, 1, 3, 2 ] ] ]);
+}, [ [ 21, 0, 1, 3, 2 ] ] ]);
 
 /** filePath: dist/pages/index/index.json **/
 {"navigationBarTitleText":"首页","usingComponents":{"comp":"../../comp"}}
@@ -1545,7 +1575,7 @@ require("../../sub-utils");
         "use strict";
         var _unused_webpack_default_export = "taro-runtime-mock";
     },
-    10: function(module, __webpack_exports__, __webpack_require__) {
+    11: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_exports__["a"] = "taro-react-mock";
     },
@@ -1607,6 +1637,29 @@ module.exports = {
             throw new TypeError("Cannot call a class as a function");
         }
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _createClass;
+    }));
+    var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(10);
+    function _defineProperties(target, props) {
+        for (var i = 0; i < props.length; i++) {
+            var descriptor = props[i];
+            descriptor.enumerable = descriptor.enumerable || false;
+            descriptor.configurable = true;
+            if ("value" in descriptor) descriptor.writable = true;
+            Object.defineProperty(target, Object(_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["a"])(descriptor.key), descriptor);
+        }
+    }
+    function _createClass(Constructor, protoProps, staticProps) {
+        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+        if (staticProps) _defineProperties(Constructor, staticProps);
+        Object.defineProperty(Constructor, "prototype", {
+            writable: false
+        });
+        return Constructor;
+    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -1657,43 +1710,6 @@ module.exports = {
             return _possibleConstructorReturn(this, result);
         };
     }
-}, function(module, __webpack_exports__, __webpack_require__) {
-    "use strict";
-    __webpack_require__.d(__webpack_exports__, "a", (function() {
-        return _createClass;
-    }));
-    var esm_typeof = __webpack_require__(8);
-    function _toPrimitive(input, hint) {
-        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
-        var prim = input[Symbol.toPrimitive];
-        if (prim !== undefined) {
-            var res = prim.call(input, hint || "default");
-            if (Object(esm_typeof["a"])(res) !== "object") return res;
-            throw new TypeError("@@toPrimitive must return a primitive value.");
-        }
-        return (hint === "string" ? String : Number)(input);
-    }
-    function _toPropertyKey(arg) {
-        var key = _toPrimitive(arg, "string");
-        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
-    }
-    function _defineProperties(target, props) {
-        for (var i = 0; i < props.length; i++) {
-            var descriptor = props[i];
-            descriptor.enumerable = descriptor.enumerable || false;
-            descriptor.configurable = true;
-            if ("value" in descriptor) descriptor.writable = true;
-            Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
-        }
-    }
-    function _createClass(Constructor, protoProps, staticProps) {
-        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
-        if (staticProps) _defineProperties(Constructor, staticProps);
-        Object.defineProperty(Constructor, "prototype", {
-            writable: false
-        });
-        return Constructor;
-    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -1735,6 +1751,26 @@ module.exports = {
             return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
         }, _typeof(obj);
     }
+}, , function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _toPropertyKey;
+    }));
+    var esm_typeof = __webpack_require__(8);
+    function _toPrimitive(input, hint) {
+        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
+        var prim = input[Symbol.toPrimitive];
+        if (prim !== undefined) {
+            var res = prim.call(input, hint || "default");
+            if (Object(esm_typeof["a"])(res) !== "object") return res;
+            throw new TypeError("@@toPrimitive must return a primitive value.");
+        }
+        return (hint === "string" ? String : Number)(input);
+    }
+    function _toPropertyKey(arg) {
+        var key = _toPrimitive(arg, "string");
+        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
+    }
 } ] ]);
 "
 `;
diff --git a/packages/taro-mini-runner/src/__tests__/__snapshots__/tabbar.spec.ts.snap b/packages/taro-mini-runner/src/__tests__/__snapshots__/tabbar.spec.ts.snap
index b7933c029cf..227cb8986fa 100644
--- a/packages/taro-mini-runner/src/__tests__/__snapshots__/tabbar.spec.ts.snap
+++ b/packages/taro-mini-runner/src/__tests__/__snapshots__/tabbar.spec.ts.snap
@@ -70,10 +70,32 @@ require("./taro");
         function useTabItemTap() {}
         function useScope() {}
     },
-    13: function(module, __webpack_exports__, __webpack_require__) {
+    10: function(module, __webpack_exports__, __webpack_require__) {
+        "use strict";
+        __webpack_require__.d(__webpack_exports__, "a", (function() {
+            return _defineProperty;
+        }));
+        var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(9);
+        function _defineProperty(obj, key, value) {
+            key = Object(_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["a"])(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
+    },
+    15: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         (function(navigator) {
-            var _tarojs_shared__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(0);
+            var _babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(10);
+            var _tarojs_shared__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(0);
             var needPromiseApis = new Set([ "addCardAuth", "getOpenUserInfo", "chooseAlipayContact", "chooseCity", "chooseContact", "choosePhoneContact", "datePicker", "getAddress", "getAuthCode", "getPhoneNumber", "getRunData", "getRunScene", "getServerTime", "getTitleColor", "rsa", "paySignCenter", "tradePay", "isCollected", "multiLevelSelect", "onLocatedComplete", "optionsSelect", "prompt", "regionPicker", "setLocatedCity", "showAuthGuide", "textRiskIdentification", "vibrate", "watchShake", "connectBLEDevice", "disconnectBLEDevice", "makeBluetoothPair", "writeBLECharacteristicValue", "readBLECharacteristicValue", "notifyBLECharacteristicValueChange", "getBLEDeviceServices", "getBLEDeviceCharacteristics", "openBluetoothAdapter", "closeBluetoothAdapter", "getBluetoothAdapterState", "startBluetoothDevicesDiscovery", "stopBluetoothDevicesDiscovery", "getBluetoothDevices", "getConnectedBluetoothDevices" ]);
             var apiDiff = {
                 login: {
@@ -563,7 +585,7 @@ require("./taro");
                 }));
             }
             function initNativeApi(taro) {
-                Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["e"])(taro, my, {
+                Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["e"])(taro, my, {
                     needPromiseApis: needPromiseApis,
                     handleSyncApis: handleSyncApis,
                     transformMeta: transformMeta,
@@ -630,7 +652,7 @@ require("./taro");
                 Slider: {
                     "track-size": "4",
                     "handle-size": "22",
-                    "handle-color": Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["singleQuote"])("#ffffff")
+                    "handle-color": Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["singleQuote"])("#ffffff")
                 },
                 Switch: {
                     controlled: "false"
@@ -659,23 +681,23 @@ require("./taro");
                     "default-source": ""
                 },
                 Camera: {
-                    mode: Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["singleQuote"])("normal"),
-                    "output-dimension": Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["singleQuote"])("720P"),
-                    "frame-size": Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["singleQuote"])("medium"),
+                    mode: Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["singleQuote"])("normal"),
+                    "output-dimension": Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["singleQuote"])("720P"),
+                    "frame-size": Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["singleQuote"])("medium"),
                     bindScanCode: "",
                     bindReady: ""
                 },
                 Canvas: {
                     type: "",
-                    width: Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["singleQuote"])("300px"),
-                    height: Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["singleQuote"])("225px"),
+                    width: Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["singleQuote"])("300px"),
+                    height: Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["singleQuote"])("225px"),
                     bindReady: ""
                 },
                 Video: {
-                    "poster-size": Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["singleQuote"])("contain"),
+                    "poster-size": Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["singleQuote"])("contain"),
                     "show-thin-progress-bar": "false",
                     "mobilenet-hint-type": "1",
-                    "floating-mode": Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["singleQuote"])("none"),
+                    "floating-mode": Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["singleQuote"])("none"),
                     enableNative: "true",
                     bindLoading: "",
                     bindUserAction: "",
@@ -716,15 +738,15 @@ require("./taro");
                     "tnt-inst-id": "",
                     scene: "",
                     size: "25",
-                    color: Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["singleQuote"])("#00A3FF"),
+                    color: Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["singleQuote"])("#00A3FF"),
                     icon: "",
                     "alipay-card-no": "",
                     "ext-info": ""
                 },
                 ArCamera: {
-                    devicePosition: Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["singleQuote"])("back"),
+                    devicePosition: Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["singleQuote"])("back"),
                     marker: "",
-                    mode: Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["singleQuote"])("imageTracking"),
+                    mode: Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["singleQuote"])("imageTracking"),
                     useCapturedImage: "false",
                     bindInit: "",
                     bindStop: "",
@@ -736,7 +758,7 @@ require("./taro");
                     duration: "300",
                     "z-index": "100",
                     overlay: "true",
-                    position: Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["singleQuote"])("bottom"),
+                    position: Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["singleQuote"])("bottom"),
                     round: "false",
                     "close-on-slide-down": "false",
                     "overlay-style": "",
@@ -755,10 +777,22 @@ require("./taro");
                     name: "",
                     transform: "false",
                     duration: "300",
-                    "easing-function": Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["singleQuote"])("ease-out")
+                    "easing-function": Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["singleQuote"])("ease-out")
                 },
                 RootPortal: {
                     enable: "true"
+                },
+                PageMeta: {
+                    "background-color": "",
+                    "background-color-top": "",
+                    "background-color-bottom": "",
+                    "root-background-color": "",
+                    "scroll-top": "''",
+                    "scroll-duration": "300",
+                    "page-style": "''",
+                    "root-font-size": "''",
+                    "page-font-size": "''",
+                    bindScroll: ""
                 }
             };
             var BUBBLE_EVENTS = new Set([ "touchStart", "touchMove", "touchEnd", "touchCancel", "tap", "longTap" ]);
@@ -782,6 +816,20 @@ require("./taro");
                 },
                 isBubbleEvents: function isBubbleEvents(eventName) {
                     return BUBBLE_EVENTS.has(eventName);
+                },
+                transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                    var _a;
+                    if (element.isTransferElement) {
+                        var _ref;
+                        var page = getCurrentPages()[0];
+                        data["nn"] = element.dataName;
+                        page.setData(Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_0__["a"])({}, Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["toCamelCase"])(data.nn), data));
+                        return _ref = {
+                            sid: element.sid
+                        }, Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_0__["a"])(_ref, "v", ""), 
+                        Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_0__["a"])(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                        _ref;
+                    }
                 }
             };
             var _navigator = navigator, userAgent = _navigator.userAgent;
@@ -792,23 +840,23 @@ require("./taro");
                     return userAgent || navigator.swuserAgent || "";
                 }
             });
-            Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["d"])(hostConfig);
-            Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_0__["c"])(components);
+            Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["d"])(hostConfig);
+            Object(_tarojs_shared__WEBPACK_IMPORTED_MODULE_1__["c"])(components);
         }).call(this, __webpack_require__(2)["navigator"]);
     },
-    14: function(module, exports, __webpack_require__) {},
-    16: function(module, __webpack_exports__, __webpack_require__) {
+    16: function(module, exports, __webpack_require__) {},
+    18: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
-        var runtime = __webpack_require__(13);
+        var runtime = __webpack_require__(15);
         var taro_runtime = __webpack_require__(2);
         var taro = __webpack_require__(0);
         var classCallCheck = __webpack_require__(4);
-        var createClass = __webpack_require__(6);
+        var createClass = __webpack_require__(5);
         var inherits = __webpack_require__(7);
-        var createSuper = __webpack_require__(5);
+        var createSuper = __webpack_require__(6);
         var react = __webpack_require__(1);
-        var app = __webpack_require__(14);
+        var app = __webpack_require__(16);
         var app_App = function(_Component) {
             Object(inherits["a"])(App, _Component);
             var _super = Object(createSuper["a"])(App);
@@ -834,7 +882,7 @@ require("./taro");
             return App;
         }(react["Component"]);
         var lib_src_app = app_App;
-        var taro_react = __webpack_require__(9);
+        var taro_react = __webpack_require__(11);
         var config = {
             pages: [ "pages/index/index", "pages/about/index" ],
             window: {
@@ -873,7 +921,7 @@ require("./taro");
             targetUnit: undefined
         });
     }
-}, [ [ 16, 0, 1, 3, 2 ] ] ]);
+}, [ [ 18, 0, 1, 3, 2 ] ] ]);
 
 
 
@@ -1012,14 +1060,14 @@ h�hځ��r������Nb2��х��K~��>;;ːL�1
 
 /** filePath: dist/pages/about/index.js **/
 (my["webpackJsonp"] = my["webpackJsonp"] || []).push([ [ 7 ], {
-    18: function(module, __webpack_exports__, __webpack_require__) {
+    20: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(2);
         var classCallCheck = __webpack_require__(4);
-        var createClass = __webpack_require__(6);
+        var createClass = __webpack_require__(5);
         var inherits = __webpack_require__(7);
-        var createSuper = __webpack_require__(5);
+        var createSuper = __webpack_require__(6);
         var react = __webpack_require__(1);
         var taro_components = __webpack_require__(8);
         var about_Index = function(_Component) {
@@ -1049,7 +1097,7 @@ h�hځ��r������Nb2��х��K~��>;;ːL�1
         }, config || {}));
         var about = __webpack_exports__["default"] = about_Index;
     }
-}, [ [ 18, 0, 1, 3, 2 ] ] ]);
+}, [ [ 20, 0, 1, 3, 2 ] ] ]);
 
 /** filePath: dist/pages/about/index.json **/
 {"navigationBarTitleText":"关于","usingComponents":{}}
@@ -1060,14 +1108,14 @@ h�hځ��r������Nb2��х��K~��>;;ːL�1
 
 /** filePath: dist/pages/index/index.js **/
 (my["webpackJsonp"] = my["webpackJsonp"] || []).push([ [ 9 ], {
-    17: function(module, __webpack_exports__, __webpack_require__) {
+    19: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(2);
         var classCallCheck = __webpack_require__(4);
-        var createClass = __webpack_require__(6);
+        var createClass = __webpack_require__(5);
         var inherits = __webpack_require__(7);
-        var createSuper = __webpack_require__(5);
+        var createSuper = __webpack_require__(6);
         var react = __webpack_require__(1);
         var taro_components = __webpack_require__(8);
         var index_Index = function(_Component) {
@@ -1097,7 +1145,7 @@ h�hځ��r������Nb2��х��K~��>;;ːL�1
         }, config || {}));
         var index = __webpack_exports__["default"] = index_Index;
     }
-}, [ [ 17, 0, 1, 3, 2 ] ] ]);
+}, [ [ 19, 0, 1, 3, 2 ] ] ]);
 
 /** filePath: dist/pages/index/index.json **/
 {"navigationBarTitleText":"首页","usingComponents":{}}
@@ -1107,6 +1155,10 @@ h�hځ��r������Nb2��х��K~��>;;ːL�1
 
 /** filePath: dist/taro.js **/
 (my["webpackJsonp"] = my["webpackJsonp"] || []).push([ [ 1 ], {
+    11: function(module, __webpack_exports__, __webpack_require__) {
+        "use strict";
+        __webpack_exports__["a"] = "taro-react-mock";
+    },
     2: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
@@ -1115,10 +1167,6 @@ h�hځ��r������Nb2��х��K~��>;;ːL�1
     8: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         var _unused_webpack_default_export = "taro-components-mock";
-    },
-    9: function(module, __webpack_exports__, __webpack_require__) {
-        "use strict";
-        __webpack_exports__["a"] = "taro-react-mock";
     }
 } ]);
 
@@ -1166,6 +1214,29 @@ export default {
             throw new TypeError("Cannot call a class as a function");
         }
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _createClass;
+    }));
+    var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(9);
+    function _defineProperties(target, props) {
+        for (var i = 0; i < props.length; i++) {
+            var descriptor = props[i];
+            descriptor.enumerable = descriptor.enumerable || false;
+            descriptor.configurable = true;
+            if ("value" in descriptor) descriptor.writable = true;
+            Object.defineProperty(target, Object(_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["a"])(descriptor.key), descriptor);
+        }
+    }
+    function _createClass(Constructor, protoProps, staticProps) {
+        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+        if (staticProps) _defineProperties(Constructor, staticProps);
+        Object.defineProperty(Constructor, "prototype", {
+            writable: false
+        });
+        return Constructor;
+    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -1216,43 +1287,6 @@ export default {
             return _possibleConstructorReturn(this, result);
         };
     }
-}, function(module, __webpack_exports__, __webpack_require__) {
-    "use strict";
-    __webpack_require__.d(__webpack_exports__, "a", (function() {
-        return _createClass;
-    }));
-    var esm_typeof = __webpack_require__(3);
-    function _toPrimitive(input, hint) {
-        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
-        var prim = input[Symbol.toPrimitive];
-        if (prim !== undefined) {
-            var res = prim.call(input, hint || "default");
-            if (Object(esm_typeof["a"])(res) !== "object") return res;
-            throw new TypeError("@@toPrimitive must return a primitive value.");
-        }
-        return (hint === "string" ? String : Number)(input);
-    }
-    function _toPropertyKey(arg) {
-        var key = _toPrimitive(arg, "string");
-        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
-    }
-    function _defineProperties(target, props) {
-        for (var i = 0; i < props.length; i++) {
-            var descriptor = props[i];
-            descriptor.enumerable = descriptor.enumerable || false;
-            descriptor.configurable = true;
-            if ("value" in descriptor) descriptor.writable = true;
-            Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
-        }
-    }
-    function _createClass(Constructor, protoProps, staticProps) {
-        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
-        if (staticProps) _defineProperties(Constructor, staticProps);
-        Object.defineProperty(Constructor, "prototype", {
-            writable: false
-        });
-        return Constructor;
-    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -1281,6 +1315,26 @@ export default {
         });
         if (superClass) _setPrototypeOf(subClass, superClass);
     }
+}, , function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _toPropertyKey;
+    }));
+    var esm_typeof = __webpack_require__(3);
+    function _toPrimitive(input, hint) {
+        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
+        var prim = input[Symbol.toPrimitive];
+        if (prim !== undefined) {
+            var res = prim.call(input, hint || "default");
+            if (Object(esm_typeof["a"])(res) !== "object") return res;
+            throw new TypeError("@@toPrimitive must return a primitive value.");
+        }
+        return (hint === "string" ? String : Number)(input);
+    }
+    function _toPropertyKey(arg) {
+        var key = _toPrimitive(arg, "string");
+        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
+    }
 } ] ]);
 "
 `;
@@ -1299,10 +1353,25 @@ require("./vendors");
 require("./taro");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 4 ], {
-    12: function(module, exports, __webpack_require__) {},
-    15: function(module, __webpack_exports__, __webpack_require__) {
+    13: function(module, exports, __webpack_require__) {},
+    16: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
+        var toPropertyKey = __webpack_require__(8);
+        function _defineProperty(obj, key, value) {
+            key = Object(toPropertyKey["a"])(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         var mocks_taro = "taro";
         function mergeReconciler() {}
         function mergeInternalComponents() {}
@@ -1714,7 +1783,7 @@ require("./taro");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -1724,10 +1793,12 @@ require("./taro");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -1796,17 +1867,30 @@ require("./taro");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, undefined(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
         mergeInternalComponents(components);
         var taro_runtime = __webpack_require__(1);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(0);
-        var app = __webpack_require__(12);
+        var app = __webpack_require__(13);
         var app_App = function(_Component) {
             Object(inherits["a"])(App, _Component);
             var _super = Object(createSuper["a"])(App);
@@ -1832,7 +1916,7 @@ require("./taro");
             return App;
         }(react["Component"]);
         var lib_src_app = app_App;
-        var taro_react = __webpack_require__(8);
+        var taro_react = __webpack_require__(9);
         var config = {
             pages: [ "pages/index/index", "pages/about/index" ],
             window: {
@@ -1871,7 +1955,7 @@ require("./taro");
             targetUnit: undefined
         });
     }
-}, [ [ 15, 0, 1, 3, 2 ] ] ]);
+}, [ [ 16, 0, 1, 3, 2 ] ] ]);
 
 
 
@@ -2642,13 +2726,13 @@ h�hځ��r������Nb2��х��K~��>;;ːL�1
 
 /** filePath: dist/comp.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 6 ], {
-    13: function(module, __webpack_exports__, __webpack_require__) {
+    14: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var _tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(1);
         Component(Object(_tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__["createRecursiveComponentConfig"])());
     }
-}, [ [ 13, 0, 1 ] ] ]);
+}, [ [ 14, 0, 1 ] ] ]);
 
 /** filePath: dist/comp.json **/
 {"component":true,"usingComponents":{"comp":"./comp"}}
@@ -2660,14 +2744,14 @@ h�hځ��r������Nb2��х��K~��>;;ːL�1
 
 /** filePath: dist/pages/about/index.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 8 ], {
-    17: function(module, __webpack_exports__, __webpack_require__) {
+    18: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(1);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(0);
         var taro_components = __webpack_require__(7);
         var about_Index = function(_Component) {
@@ -2697,7 +2781,7 @@ h�hځ��r������Nb2��х��K~��>;;ːL�1
         }, config || {}));
         var about = __webpack_exports__["default"] = about_Index;
     }
-}, [ [ 17, 0, 1, 3, 2 ] ] ]);
+}, [ [ 18, 0, 1, 3, 2 ] ] ]);
 
 /** filePath: dist/pages/about/index.json **/
 {"navigationBarTitleText":"关于","usingComponents":{"comp":"../../comp"}}
@@ -2708,14 +2792,14 @@ h�hځ��r������Nb2��х��K~��>;;ːL�1
 
 /** filePath: dist/pages/index/index.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 10 ], {
-    16: function(module, __webpack_exports__, __webpack_require__) {
+    17: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(1);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(0);
         var taro_components = __webpack_require__(7);
         var index_Index = function(_Component) {
@@ -2745,7 +2829,7 @@ h�hځ��r������Nb2��х��K~��>;;ːL�1
         }, config || {}));
         var index = __webpack_exports__["default"] = index_Index;
     }
-}, [ [ 16, 0, 1, 3, 2 ] ] ]);
+}, [ [ 17, 0, 1, 3, 2 ] ] ]);
 
 /** filePath: dist/pages/index/index.json **/
 {"navigationBarTitleText":"首页","usingComponents":{"comp":"../../comp"}}
@@ -2767,7 +2851,7 @@ h�hځ��r������Nb2��х��K~��>;;ːL�1
         "use strict";
         var _unused_webpack_default_export = "taro-components-mock";
     },
-    8: function(module, __webpack_exports__, __webpack_require__) {
+    9: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_exports__["a"] = "taro-react-mock";
     }
@@ -2838,6 +2922,29 @@ module.exports = {
             throw new TypeError("Cannot call a class as a function");
         }
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _createClass;
+    }));
+    var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(8);
+    function _defineProperties(target, props) {
+        for (var i = 0; i < props.length; i++) {
+            var descriptor = props[i];
+            descriptor.enumerable = descriptor.enumerable || false;
+            descriptor.configurable = true;
+            if ("value" in descriptor) descriptor.writable = true;
+            Object.defineProperty(target, Object(_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["a"])(descriptor.key), descriptor);
+        }
+    }
+    function _createClass(Constructor, protoProps, staticProps) {
+        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+        if (staticProps) _defineProperties(Constructor, staticProps);
+        Object.defineProperty(Constructor, "prototype", {
+            writable: false
+        });
+        return Constructor;
+    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -2888,43 +2995,6 @@ module.exports = {
             return _possibleConstructorReturn(this, result);
         };
     }
-}, function(module, __webpack_exports__, __webpack_require__) {
-    "use strict";
-    __webpack_require__.d(__webpack_exports__, "a", (function() {
-        return _createClass;
-    }));
-    var esm_typeof = __webpack_require__(2);
-    function _toPrimitive(input, hint) {
-        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
-        var prim = input[Symbol.toPrimitive];
-        if (prim !== undefined) {
-            var res = prim.call(input, hint || "default");
-            if (Object(esm_typeof["a"])(res) !== "object") return res;
-            throw new TypeError("@@toPrimitive must return a primitive value.");
-        }
-        return (hint === "string" ? String : Number)(input);
-    }
-    function _toPropertyKey(arg) {
-        var key = _toPrimitive(arg, "string");
-        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
-    }
-    function _defineProperties(target, props) {
-        for (var i = 0; i < props.length; i++) {
-            var descriptor = props[i];
-            descriptor.enumerable = descriptor.enumerable || false;
-            descriptor.configurable = true;
-            if ("value" in descriptor) descriptor.writable = true;
-            Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
-        }
-    }
-    function _createClass(Constructor, protoProps, staticProps) {
-        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
-        if (staticProps) _defineProperties(Constructor, staticProps);
-        Object.defineProperty(Constructor, "prototype", {
-            writable: false
-        });
-        return Constructor;
-    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -2953,6 +3023,26 @@ module.exports = {
         });
         if (superClass) _setPrototypeOf(subClass, superClass);
     }
+}, , function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _toPropertyKey;
+    }));
+    var esm_typeof = __webpack_require__(2);
+    function _toPrimitive(input, hint) {
+        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
+        var prim = input[Symbol.toPrimitive];
+        if (prim !== undefined) {
+            var res = prim.call(input, hint || "default");
+            if (Object(esm_typeof["a"])(res) !== "object") return res;
+            throw new TypeError("@@toPrimitive must return a primitive value.");
+        }
+        return (hint === "string" ? String : Number)(input);
+    }
+    function _toPropertyKey(arg) {
+        var key = _toPrimitive(arg, "string");
+        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
+    }
 } ] ]);
 "
 `;
diff --git a/packages/taro-mini-runner/src/__tests__/__snapshots__/ts.spec.ts.snap b/packages/taro-mini-runner/src/__tests__/__snapshots__/ts.spec.ts.snap
index a0de0bd8f30..95ff8c82e2b 100644
--- a/packages/taro-mini-runner/src/__tests__/__snapshots__/ts.spec.ts.snap
+++ b/packages/taro-mini-runner/src/__tests__/__snapshots__/ts.spec.ts.snap
@@ -14,10 +14,25 @@ require("./vendors");
 require("./taro");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 4 ], {
-    11: function(module, exports, __webpack_require__) {},
-    15: function(module, __webpack_exports__, __webpack_require__) {
+    12: function(module, exports, __webpack_require__) {},
+    16: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
+        var toPropertyKey = __webpack_require__(7);
+        function _defineProperty(obj, key, value) {
+            key = Object(toPropertyKey["a"])(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         var mocks_taro = "taro";
         function mergeReconciler() {}
         function mergeInternalComponents() {}
@@ -429,7 +444,7 @@ require("./taro");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -439,10 +454,12 @@ require("./taro");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -511,17 +528,30 @@ require("./taro");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, undefined(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
         mergeInternalComponents(components);
         var taro_runtime = __webpack_require__(0);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(1);
-        var app = __webpack_require__(11);
+        var app = __webpack_require__(12);
         var app_App = function(_Component) {
             Object(inherits["a"])(App, _Component);
             var _super = Object(createSuper["a"])(App);
@@ -547,7 +577,7 @@ require("./taro");
             return App;
         }(react["Component"]);
         var lib_src_app = app_App;
-        var taro_react = __webpack_require__(8);
+        var taro_react = __webpack_require__(9);
         var config = {
             pages: [ "pages/index/index" ],
             window: {
@@ -571,7 +601,7 @@ require("./taro");
             targetUnit: undefined
         });
     }
-}, [ [ 15, 0, 1, 3, 2 ] ] ]);
+}, [ [ 16, 0, 1, 3, 2 ] ] ]);
 
 
 
@@ -1308,13 +1338,13 @@ require("./taro");
 
 /** filePath: dist/comp.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 6 ], {
-    12: function(module, __webpack_exports__, __webpack_require__) {
+    13: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var _tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(0);
         Component(Object(_tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__["createRecursiveComponentConfig"])());
     }
-}, [ [ 12, 0, 1 ] ] ]);
+}, [ [ 13, 0, 1 ] ] ]);
 
 /** filePath: dist/comp.json **/
 {"component":true,"usingComponents":{"comp":"./comp"}}
@@ -1326,18 +1356,18 @@ require("./taro");
 
 /** filePath: dist/pages/index/index.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 8 ], {
-    14: function(module, exports, __webpack_require__) {},
-    16: function(module, __webpack_exports__, __webpack_require__) {
+    15: function(module, exports, __webpack_require__) {},
+    17: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(0);
         var classCallCheck = __webpack_require__(3);
-        var createClass = __webpack_require__(5);
+        var createClass = __webpack_require__(4);
         var inherits = __webpack_require__(6);
-        var createSuper = __webpack_require__(4);
+        var createSuper = __webpack_require__(5);
         var react = __webpack_require__(1);
-        var taro_components = __webpack_require__(7);
-        var index = __webpack_require__(14);
+        var taro_components = __webpack_require__(8);
+        var index = __webpack_require__(15);
         var index_Index = function(_Component) {
             Object(inherits["a"])(Index, _Component);
             var _super = Object(createSuper["a"])(Index);
@@ -1380,7 +1410,7 @@ require("./taro");
         }, config || {}));
         var pages_index = __webpack_exports__["default"] = index_Index;
     }
-}, [ [ 16, 0, 1, 3, 2 ] ] ]);
+}, [ [ 17, 0, 1, 3, 2 ] ] ]);
 
 /** filePath: dist/pages/index/index.json **/
 {"navigationBarTitleText":"首页","usingComponents":{"comp":"../../comp"}}
@@ -1401,11 +1431,11 @@ require("./taro");
         "use strict";
         var _unused_webpack_default_export = "taro-runtime-mock";
     },
-    7: function(module, __webpack_exports__, __webpack_require__) {
+    8: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         var _unused_webpack_default_export = "taro-components-mock";
     },
-    8: function(module, __webpack_exports__, __webpack_require__) {
+    9: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_exports__["a"] = "taro-react-mock";
     }
@@ -1476,6 +1506,29 @@ module.exports = {
             throw new TypeError("Cannot call a class as a function");
         }
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _createClass;
+    }));
+    var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(7);
+    function _defineProperties(target, props) {
+        for (var i = 0; i < props.length; i++) {
+            var descriptor = props[i];
+            descriptor.enumerable = descriptor.enumerable || false;
+            descriptor.configurable = true;
+            if ("value" in descriptor) descriptor.writable = true;
+            Object.defineProperty(target, Object(_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["a"])(descriptor.key), descriptor);
+        }
+    }
+    function _createClass(Constructor, protoProps, staticProps) {
+        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+        if (staticProps) _defineProperties(Constructor, staticProps);
+        Object.defineProperty(Constructor, "prototype", {
+            writable: false
+        });
+        return Constructor;
+    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -1526,43 +1579,6 @@ module.exports = {
             return _possibleConstructorReturn(this, result);
         };
     }
-}, function(module, __webpack_exports__, __webpack_require__) {
-    "use strict";
-    __webpack_require__.d(__webpack_exports__, "a", (function() {
-        return _createClass;
-    }));
-    var esm_typeof = __webpack_require__(2);
-    function _toPrimitive(input, hint) {
-        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
-        var prim = input[Symbol.toPrimitive];
-        if (prim !== undefined) {
-            var res = prim.call(input, hint || "default");
-            if (Object(esm_typeof["a"])(res) !== "object") return res;
-            throw new TypeError("@@toPrimitive must return a primitive value.");
-        }
-        return (hint === "string" ? String : Number)(input);
-    }
-    function _toPropertyKey(arg) {
-        var key = _toPrimitive(arg, "string");
-        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
-    }
-    function _defineProperties(target, props) {
-        for (var i = 0; i < props.length; i++) {
-            var descriptor = props[i];
-            descriptor.enumerable = descriptor.enumerable || false;
-            descriptor.configurable = true;
-            if ("value" in descriptor) descriptor.writable = true;
-            Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
-        }
-    }
-    function _createClass(Constructor, protoProps, staticProps) {
-        if (protoProps) _defineProperties(Constructor.prototype, protoProps);
-        if (staticProps) _defineProperties(Constructor, staticProps);
-        Object.defineProperty(Constructor, "prototype", {
-            writable: false
-        });
-        return Constructor;
-    }
 }, function(module, __webpack_exports__, __webpack_require__) {
     "use strict";
     __webpack_require__.d(__webpack_exports__, "a", (function() {
@@ -1591,6 +1607,26 @@ module.exports = {
         });
         if (superClass) _setPrototypeOf(subClass, superClass);
     }
+}, function(module, __webpack_exports__, __webpack_require__) {
+    "use strict";
+    __webpack_require__.d(__webpack_exports__, "a", (function() {
+        return _toPropertyKey;
+    }));
+    var esm_typeof = __webpack_require__(2);
+    function _toPrimitive(input, hint) {
+        if (Object(esm_typeof["a"])(input) !== "object" || input === null) return input;
+        var prim = input[Symbol.toPrimitive];
+        if (prim !== undefined) {
+            var res = prim.call(input, hint || "default");
+            if (Object(esm_typeof["a"])(res) !== "object") return res;
+            throw new TypeError("@@toPrimitive must return a primitive value.");
+        }
+        return (hint === "string" ? String : Number)(input);
+    }
+    function _toPropertyKey(arg) {
+        var key = _toPrimitive(arg, "string");
+        return Object(esm_typeof["a"])(key) === "symbol" ? key : String(key);
+    }
 } ] ]);
 "
 `;
diff --git a/packages/taro-mini-runner/src/__tests__/__snapshots__/vue.spec.ts.snap b/packages/taro-mini-runner/src/__tests__/__snapshots__/vue.spec.ts.snap
index f0e76939794..3f3f3ae805e 100644
--- a/packages/taro-mini-runner/src/__tests__/__snapshots__/vue.spec.ts.snap
+++ b/packages/taro-mini-runner/src/__tests__/__snapshots__/vue.spec.ts.snap
@@ -11,9 +11,45 @@ require("./taro");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 2 ], {
     3: function(module, exports, __webpack_require__) {},
-    7: function(module, __webpack_exports__, __webpack_require__) {
+    6: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
+        function _typeof(obj) {
+            "@babel/helpers - typeof";
+            return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(obj) {
+                return typeof obj;
+            } : function(obj) {
+                return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
+            }, _typeof(obj);
+        }
+        function _toPrimitive(input, hint) {
+            if (_typeof(input) !== "object" || input === null) return input;
+            var prim = input[Symbol.toPrimitive];
+            if (prim !== undefined) {
+                var res = prim.call(input, hint || "default");
+                if (_typeof(res) !== "object") return res;
+                throw new TypeError("@@toPrimitive must return a primitive value.");
+            }
+            return (hint === "string" ? String : Number)(input);
+        }
+        function _toPropertyKey(arg) {
+            var key = _toPrimitive(arg, "string");
+            return _typeof(key) === "symbol" ? key : String(key);
+        }
+        function _defineProperty(obj, key, value) {
+            key = _toPropertyKey(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         var mocks_taro = "taro";
         function mergeReconciler() {}
         function mergeInternalComponents() {}
@@ -425,7 +461,7 @@ require("./taro");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -435,10 +471,12 @@ require("./taro");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -507,6 +545,19 @@ require("./taro");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, undefined(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
@@ -544,7 +595,7 @@ require("./taro");
             targetUnit: undefined
         });
     }
-}, [ [ 7, 0, 1 ] ] ]);
+}, [ [ 6, 0, 1 ] ] ]);
 
 
 
@@ -1292,7 +1343,7 @@ require("./taro");
 
 /** filePath: dist/pages/index/index.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 6 ], {
-    6: function(module, __webpack_exports__, __webpack_require__) {
+    7: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(0);
@@ -1375,7 +1426,7 @@ require("./taro");
         }, config || {}));
         var pages_index = __webpack_exports__["default"] = index;
     }
-}, [ [ 6, 0, 1 ] ] ]);
+}, [ [ 7, 0, 1 ] ] ]);
 
 /** filePath: dist/pages/index/index.json **/
 {"navigationBarTitleText":"首页","usingComponents":{"comp":"../../comp"}}
diff --git a/packages/taro-mini-runner/src/__tests__/__snapshots__/vue3.spec.ts.snap b/packages/taro-mini-runner/src/__tests__/__snapshots__/vue3.spec.ts.snap
index 158fd7b6ba8..6f71be558db 100644
--- a/packages/taro-mini-runner/src/__tests__/__snapshots__/vue3.spec.ts.snap
+++ b/packages/taro-mini-runner/src/__tests__/__snapshots__/vue3.spec.ts.snap
@@ -13,9 +13,45 @@ require("./taro");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 3 ], {
     4: function(module, exports, __webpack_require__) {},
-    8: function(module, __webpack_exports__, __webpack_require__) {
+    7: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
+        function _typeof(obj) {
+            "@babel/helpers - typeof";
+            return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(obj) {
+                return typeof obj;
+            } : function(obj) {
+                return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
+            }, _typeof(obj);
+        }
+        function _toPrimitive(input, hint) {
+            if (_typeof(input) !== "object" || input === null) return input;
+            var prim = input[Symbol.toPrimitive];
+            if (prim !== undefined) {
+                var res = prim.call(input, hint || "default");
+                if (_typeof(res) !== "object") return res;
+                throw new TypeError("@@toPrimitive must return a primitive value.");
+            }
+            return (hint === "string" ? String : Number)(input);
+        }
+        function _toPropertyKey(arg) {
+            var key = _toPrimitive(arg, "string");
+            return _typeof(key) === "symbol" ? key : String(key);
+        }
+        function _defineProperty(obj, key, value) {
+            key = _toPropertyKey(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         var mocks_taro = "taro";
         function mergeReconciler() {}
         function mergeInternalComponents() {}
@@ -427,7 +463,7 @@ require("./taro");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -437,10 +473,12 @@ require("./taro");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -509,6 +547,19 @@ require("./taro");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, undefined(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
@@ -543,7 +594,7 @@ require("./taro");
             targetUnit: undefined
         });
     }
-}, [ [ 8, 0, 1, 2 ] ] ]);
+}, [ [ 7, 0, 1, 2 ] ] ]);
 
 
 
@@ -1297,7 +1348,7 @@ require("./taro");
 
 /** filePath: dist/pages/index/index.js **/
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 7 ], {
-    7: function(module, __webpack_exports__, __webpack_require__) {
+    8: function(module, __webpack_exports__, __webpack_require__) {
         "use strict";
         __webpack_require__.r(__webpack_exports__);
         var taro_runtime = __webpack_require__(0);
@@ -1382,7 +1433,7 @@ require("./taro");
         }, config || {}));
         var pages_index = __webpack_exports__["default"] = index;
     }
-}, [ [ 7, 0, 1, 2 ] ] ]);
+}, [ [ 8, 0, 1, 2 ] ] ]);
 
 /** filePath: dist/pages/index/index.json **/
 {"navigationBarTitleText":"首页","usingComponents":{"comp":"../../comp"}}
diff --git a/packages/taro-mini-runner/src/__tests__/__snapshots__/wx-hybrid.spec.ts.snap b/packages/taro-mini-runner/src/__tests__/__snapshots__/wx-hybrid.spec.ts.snap
index 2be0088101b..e6bceda28cf 100644
--- a/packages/taro-mini-runner/src/__tests__/__snapshots__/wx-hybrid.spec.ts.snap
+++ b/packages/taro-mini-runner/src/__tests__/__snapshots__/wx-hybrid.spec.ts.snap
@@ -390,7 +390,7 @@ require("./taro");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -400,10 +400,12 @@ require("./taro");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -472,6 +474,21 @@ require("./taro");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    const page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData({
+                        [Object(mocks_taro["toCamelCase"])(data.nn)]: data
+                    });
+                    return {
+                        sid: element.sid,
+                        ["v"]: "",
+                        ["nn"]: ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"
+                    };
+                }
             }
         };
         Object(mocks_taro["e"])(hostConfig);
diff --git a/packages/taro-runtime/src/dom/document.ts b/packages/taro-runtime/src/dom/document.ts
index 0c5f4ee97a3..0cedfa75808 100644
--- a/packages/taro-runtime/src/dom/document.ts
+++ b/packages/taro-runtime/src/dom/document.ts
@@ -1,4 +1,4 @@
-import { controlledComponent, isUndefined } from '@tarojs/shared'
+import { controlledComponent, isUndefined, toCamelCase } from '@tarojs/shared'
 
 import {
   A,
@@ -15,6 +15,7 @@ import { TaroRootElement } from '../dom/root'
 import { TaroText } from '../dom/text'
 import env from '../env'
 import { AnchorElement } from './anchor-element'
+import { TransferElement } from './transfer'
 
 export class TaroDocument extends TaroElement {
   public documentElement: TaroElement
@@ -42,6 +43,10 @@ export class TaroDocument extends TaroElement {
       case nodeName === A:
         element = new AnchorElement()
         break
+      case nodeName === 'page-meta':
+      case nodeName === 'navigation-bar':
+        element = new TransferElement(toCamelCase(nodeName))
+        break
       default:
         element = new TaroElement()
         break
diff --git a/packages/taro-runtime/src/dom/transfer.ts b/packages/taro-runtime/src/dom/transfer.ts
new file mode 100644
index 00000000000..4758dfb9139
--- /dev/null
+++ b/packages/taro-runtime/src/dom/transfer.ts
@@ -0,0 +1,13 @@
+import { TaroElement } from './element'
+
+export class TransferElement extends TaroElement {
+  public isTransferElement = true
+
+  constructor (public dataName: string) {
+    super()
+  }
+
+  public get _path () {
+    return this.dataName
+  }
+}
diff --git a/packages/taro-runtime/src/hydrate.ts b/packages/taro-runtime/src/hydrate.ts
index 9bba58503f0..19ae5a6b5dc 100644
--- a/packages/taro-runtime/src/hydrate.ts
+++ b/packages/taro-runtime/src/hydrate.ts
@@ -112,5 +112,7 @@ export function hydrate (node: TaroElement | TaroText): MiniData {
     }
   }
 
-  return data
+  const resData = hooks.call('transferHydrateData', data, node, componentAlias)
+
+  return resData || data
 }
diff --git a/packages/taro-weapp/src/components.ts b/packages/taro-weapp/src/components.ts
index 38718ccaeab..a160748f710 100644
--- a/packages/taro-weapp/src/components.ts
+++ b/packages/taro-weapp/src/components.ts
@@ -347,7 +347,7 @@ export const components = {
   NavigationBar: {
     title: _empty,
     loading: _false,
-    'front-color': _empty,
+    'front-color': "'#000000'",
     'background-color': _empty,
     'color-animation-duration': _zero,
     'color-animation-timing-func': "'linear'"
@@ -357,10 +357,12 @@ export const components = {
     'background-color': _empty,
     'background-color-top': _empty,
     'background-color-bottom': _empty,
+    'root-background-color': _empty,
     'scroll-top': "''",
     'scroll-duration': '300',
     'page-style': "''",
     'root-font-size': "''",
+    'page-orientation': "''",
     bindResize: _empty,
     bindScroll: _empty,
     bindScrollDone: _empty
diff --git a/packages/taro-weapp/src/runtime-utils.ts b/packages/taro-weapp/src/runtime-utils.ts
index 18d64fc348e..4f0557a105d 100644
--- a/packages/taro-weapp/src/runtime-utils.ts
+++ b/packages/taro-weapp/src/runtime-utils.ts
@@ -1,5 +1,9 @@
+import { Shortcuts, toCamelCase } from '@tarojs/shared'
+
 import { initNativeApi } from './apis'
 
+declare const getCurrentPages: any
+
 export { initNativeApi }
 export * from './apis-list'
 export * from './components'
@@ -11,5 +15,19 @@ export const hostConfig = {
       methods.push('onSaveExitState')
     }
     return config
-  }
+  },
+  transferHydrateData (data, element, componentsAlias) {
+    if (element.isTransferElement) {
+      const page = getCurrentPages()[0]
+      data[Shortcuts.NodeName] = element.dataName
+      page.setData({
+        [toCamelCase(data.nn)]: data
+      })
+      return {
+        sid: element.sid,
+        [Shortcuts.Text]: '',
+        [Shortcuts.NodeName]: componentsAlias['#text']?._num || '8'
+      }
+    }
+  },
 }
diff --git a/packages/taro-weapp/src/template.ts b/packages/taro-weapp/src/template.ts
index ab97173f57c..583cc36fc76 100644
--- a/packages/taro-weapp/src/template.ts
+++ b/packages/taro-weapp/src/template.ts
@@ -17,6 +17,8 @@ export class Template extends UnRecursiveTemplate {
     type: 'weapp'
   }
 
+  transferComponents: Record<string, Record<string, string>> = {}
+
   constructor (pluginOptions?: IOptions) {
     super()
     this.pluginOptions = pluginOptions || {}
@@ -26,6 +28,18 @@ export class Template extends UnRecursiveTemplate {
     return '<wxs module="xs" src="./utils.wxs" />'
   }
 
+  createMiniComponents (components): any {
+    const result = super.createMiniComponents(components)
+
+    // PageMeta & NavigationBar
+    this.transferComponents['page-meta'] = result['page-meta']
+    this.transferComponents['navigation-bar'] = result['navigation-bar']
+    delete result['page-meta']
+    delete result['navigation-bar']
+
+    return result
+  }
+
   replacePropName (name: string, value: string, componentName: string, componentAlias) {
     if (value === 'eh') {
       const nameLowerCase = name.toLowerCase()
@@ -88,4 +102,31 @@ export class Template extends UnRecursiveTemplate {
 
     return res
   }
+
+  buildPageTemplate = (baseTempPath: string, page) => {
+    let pageMetaTemplate = ''
+    const pageConfig = page?.content
+
+    if (pageConfig?.enablePageMeta) {
+      const getComponentAttrs = (componentName: string, dataPath: string) => {
+        return Object.entries(this.transferComponents[componentName]).reduce((sum, [key, value]) => {
+          sum +=`${key}="${value === 'eh' ? value : `{{${value.replace('i.', dataPath)}}}`}" `
+          return sum
+        }, '')
+      }
+      const pageMetaAttrs = getComponentAttrs('page-meta', 'pageMeta.')
+      const navigationBarAttrs = getComponentAttrs('navigation-bar', 'navigationBar.')
+
+      pageMetaTemplate = `
+<wxs module="xs" src="${baseTempPath.replace('base.wxml', 'utils.wxs')}" />
+<page-meta data-sid="{{pageMeta.sid}}" ${pageMetaAttrs}>
+  <navigation-bar ${navigationBarAttrs}/>
+</page-meta>`
+    }
+
+    const template = `<import src="${baseTempPath}"/>${pageMetaTemplate}
+<template is="taro_tmpl" data="{{${this.dataKeymap('root:root')}}}" />`
+
+    return template
+  }
 }
diff --git a/packages/taro-webpack5-runner/src/__tests__/__snapshots__/babel.spec.ts.snap b/packages/taro-webpack5-runner/src/__tests__/__snapshots__/babel.spec.ts.snap
index f48c57ea9a5..917415085e1 100644
--- a/packages/taro-webpack5-runner/src/__tests__/__snapshots__/babel.spec.ts.snap
+++ b/packages/taro-webpack5-runner/src/__tests__/__snapshots__/babel.spec.ts.snap
@@ -14,7 +14,22 @@ require("./vendors");
 require("./runtime");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 143 ], {
-    707: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+    442: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+        var toPropertyKey = __webpack_require__(25);
+        function _defineProperty(obj, key, value) {
+            key = (0, toPropertyKey.Z)(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         function mergeReconciler() {}
         function mergeInternalComponents() {}
         function isArray() {}
@@ -415,7 +430,7 @@ require("./runtime");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -425,10 +440,12 @@ require("./runtime");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -497,6 +514,19 @@ require("./runtime");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, toCamelCase(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
@@ -535,7 +565,7 @@ require("./runtime");
         function initPxTransform() {}
         var taro = "taro";
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -593,7 +623,7 @@ require("./runtime");
         return __webpack_require__(__webpack_require__.s = moduleId);
     };
     __webpack_require__.O(0, [ 216, 592 ], (function() {
-        return __webpack_exec__(707);
+        return __webpack_exec__(442);
     }));
     var __webpack_exports__ = __webpack_require__.O();
 } ]);
@@ -1395,7 +1425,7 @@ require("./runtime");
     934: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
         var taro_runtime = __webpack_require__(184);
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -1523,34 +1553,20 @@ module.exports = {
             }
         }
     },
-    815: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+    599: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
                 return _createClass;
             }
         });
-        var esm_typeof = __webpack_require__(671);
-        function _toPrimitive(input, hint) {
-            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
-            var prim = input[Symbol.toPrimitive];
-            if (prim !== undefined) {
-                var res = prim.call(input, hint || "default");
-                if ((0, esm_typeof.Z)(res) !== "object") return res;
-                throw new TypeError("@@toPrimitive must return a primitive value.");
-            }
-            return (hint === "string" ? String : Number)(input);
-        }
-        function _toPropertyKey(arg) {
-            var key = _toPrimitive(arg, "string");
-            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
-        }
+        var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(25);
         function _defineProperties(target, props) {
             for (var i = 0; i < props.length; i++) {
                 var descriptor = props[i];
                 descriptor.enumerable = descriptor.enumerable || false;
                 descriptor.configurable = true;
                 if ("value" in descriptor) descriptor.writable = true;
-                Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
+                Object.defineProperty(target, (0, _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__.Z)(descriptor.key), descriptor);
             }
         }
         function _createClass(Constructor, protoProps, staticProps) {
@@ -1644,6 +1660,28 @@ module.exports = {
             if (superClass) _setPrototypeOf(subClass, superClass);
         }
     },
+    25: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+        __webpack_require__.d(__webpack_exports__, {
+            Z: function() {
+                return _toPropertyKey;
+            }
+        });
+        var esm_typeof = __webpack_require__(671);
+        function _toPrimitive(input, hint) {
+            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
+            var prim = input[Symbol.toPrimitive];
+            if (prim !== undefined) {
+                var res = prim.call(input, hint || "default");
+                if ((0, esm_typeof.Z)(res) !== "object") return res;
+                throw new TypeError("@@toPrimitive must return a primitive value.");
+            }
+            return (hint === "string" ? String : Number)(input);
+        }
+        function _toPropertyKey(arg) {
+            var key = _toPrimitive(arg, "string");
+            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
+        }
+    },
     671: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
diff --git a/packages/taro-webpack5-runner/src/__tests__/__snapshots__/compiler-macros.spec.ts.snap b/packages/taro-webpack5-runner/src/__tests__/__snapshots__/compiler-macros.spec.ts.snap
index 44bedf161db..bbba7a6765b 100644
--- a/packages/taro-webpack5-runner/src/__tests__/__snapshots__/compiler-macros.spec.ts.snap
+++ b/packages/taro-webpack5-runner/src/__tests__/__snapshots__/compiler-macros.spec.ts.snap
@@ -14,7 +14,22 @@ require("./vendors");
 require("./runtime");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 143 ], {
-    707: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+    442: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+        var toPropertyKey = __webpack_require__(25);
+        function _defineProperty(obj, key, value) {
+            key = (0, toPropertyKey.Z)(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         function mergeReconciler() {}
         function mergeInternalComponents() {}
         function isArray() {}
@@ -415,7 +430,7 @@ require("./runtime");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -425,10 +440,12 @@ require("./runtime");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -497,6 +514,19 @@ require("./runtime");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, toCamelCase(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
@@ -535,7 +565,7 @@ require("./runtime");
         function initPxTransform() {}
         var taro = "taro";
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -593,7 +623,7 @@ require("./runtime");
         return __webpack_require__(__webpack_require__.s = moduleId);
     };
     __webpack_require__.O(0, [ 216, 592 ], (function() {
-        return __webpack_exec__(707);
+        return __webpack_exec__(442);
     }));
     var __webpack_exports__ = __webpack_require__.O();
 } ]);
@@ -1395,7 +1425,7 @@ require("./runtime");
     934: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
         var taro_runtime = __webpack_require__(184);
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -1518,34 +1548,20 @@ module.exports = {
             }
         }
     },
-    815: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+    599: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
                 return _createClass;
             }
         });
-        var esm_typeof = __webpack_require__(671);
-        function _toPrimitive(input, hint) {
-            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
-            var prim = input[Symbol.toPrimitive];
-            if (prim !== undefined) {
-                var res = prim.call(input, hint || "default");
-                if ((0, esm_typeof.Z)(res) !== "object") return res;
-                throw new TypeError("@@toPrimitive must return a primitive value.");
-            }
-            return (hint === "string" ? String : Number)(input);
-        }
-        function _toPropertyKey(arg) {
-            var key = _toPrimitive(arg, "string");
-            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
-        }
+        var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(25);
         function _defineProperties(target, props) {
             for (var i = 0; i < props.length; i++) {
                 var descriptor = props[i];
                 descriptor.enumerable = descriptor.enumerable || false;
                 descriptor.configurable = true;
                 if ("value" in descriptor) descriptor.writable = true;
-                Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
+                Object.defineProperty(target, (0, _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__.Z)(descriptor.key), descriptor);
             }
         }
         function _createClass(Constructor, protoProps, staticProps) {
@@ -1639,6 +1655,28 @@ module.exports = {
             if (superClass) _setPrototypeOf(subClass, superClass);
         }
     },
+    25: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+        __webpack_require__.d(__webpack_exports__, {
+            Z: function() {
+                return _toPropertyKey;
+            }
+        });
+        var esm_typeof = __webpack_require__(671);
+        function _toPrimitive(input, hint) {
+            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
+            var prim = input[Symbol.toPrimitive];
+            if (prim !== undefined) {
+                var res = prim.call(input, hint || "default");
+                if ((0, esm_typeof.Z)(res) !== "object") return res;
+                throw new TypeError("@@toPrimitive must return a primitive value.");
+            }
+            return (hint === "string" ? String : Number)(input);
+        }
+        function _toPropertyKey(arg) {
+            var key = _toPrimitive(arg, "string");
+            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
+        }
+    },
     671: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
diff --git a/packages/taro-webpack5-runner/src/__tests__/__snapshots__/config.spec.ts.snap b/packages/taro-webpack5-runner/src/__tests__/__snapshots__/config.spec.ts.snap
index 825e321a117..dca6bb68879 100644
--- a/packages/taro-webpack5-runner/src/__tests__/__snapshots__/config.spec.ts.snap
+++ b/packages/taro-webpack5-runner/src/__tests__/__snapshots__/config.spec.ts.snap
@@ -14,7 +14,22 @@ require("./vendors");
 require("./runtime");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 143 ], {
-    662: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+    845: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+        var toPropertyKey = __webpack_require__(25);
+        function _defineProperty(obj, key, value) {
+            key = (0, toPropertyKey.Z)(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         function mergeReconciler() {}
         function mergeInternalComponents() {}
         function isArray() {}
@@ -415,7 +430,7 @@ require("./runtime");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -425,10 +440,12 @@ require("./runtime");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -497,6 +514,19 @@ require("./runtime");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, toCamelCase(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
@@ -535,7 +565,7 @@ require("./runtime");
         function initPxTransform() {}
         var taro = "taro";
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -593,7 +623,7 @@ require("./runtime");
         return __webpack_require__(__webpack_require__.s = moduleId);
     };
     __webpack_require__.O(0, [ 216, 592 ], (function() {
-        return __webpack_exec__(662);
+        return __webpack_exec__(845);
     }));
     var __webpack_exports__ = __webpack_require__.O();
 } ]);
@@ -1555,7 +1585,7 @@ require("./runtime");
     213: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
         var taro_runtime = __webpack_require__(184);
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -1689,34 +1719,20 @@ module.exports = {
             }
         }
     },
-    815: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+    599: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
                 return _createClass;
             }
         });
-        var esm_typeof = __webpack_require__(671);
-        function _toPrimitive(input, hint) {
-            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
-            var prim = input[Symbol.toPrimitive];
-            if (prim !== undefined) {
-                var res = prim.call(input, hint || "default");
-                if ((0, esm_typeof.Z)(res) !== "object") return res;
-                throw new TypeError("@@toPrimitive must return a primitive value.");
-            }
-            return (hint === "string" ? String : Number)(input);
-        }
-        function _toPropertyKey(arg) {
-            var key = _toPrimitive(arg, "string");
-            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
-        }
+        var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(25);
         function _defineProperties(target, props) {
             for (var i = 0; i < props.length; i++) {
                 var descriptor = props[i];
                 descriptor.enumerable = descriptor.enumerable || false;
                 descriptor.configurable = true;
                 if ("value" in descriptor) descriptor.writable = true;
-                Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
+                Object.defineProperty(target, (0, _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__.Z)(descriptor.key), descriptor);
             }
         }
         function _createClass(Constructor, protoProps, staticProps) {
@@ -1810,6 +1826,28 @@ module.exports = {
             if (superClass) _setPrototypeOf(subClass, superClass);
         }
     },
+    25: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+        __webpack_require__.d(__webpack_exports__, {
+            Z: function() {
+                return _toPropertyKey;
+            }
+        });
+        var esm_typeof = __webpack_require__(671);
+        function _toPrimitive(input, hint) {
+            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
+            var prim = input[Symbol.toPrimitive];
+            if (prim !== undefined) {
+                var res = prim.call(input, hint || "default");
+                if ((0, esm_typeof.Z)(res) !== "object") return res;
+                throw new TypeError("@@toPrimitive must return a primitive value.");
+            }
+            return (hint === "string" ? String : Number)(input);
+        }
+        function _toPropertyKey(arg) {
+            var key = _toPrimitive(arg, "string");
+            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
+        }
+    },
     671: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
@@ -1843,7 +1881,22 @@ require("./vendors");
 require("./runtime");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 143 ], {
-    662: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+    845: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+        var toPropertyKey = __webpack_require__(25);
+        function _defineProperty(obj, key, value) {
+            key = (0, toPropertyKey.Z)(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         function mergeReconciler() {}
         function mergeInternalComponents() {}
         function isArray() {}
@@ -2244,7 +2297,7 @@ require("./runtime");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -2254,10 +2307,12 @@ require("./runtime");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -2326,6 +2381,19 @@ require("./runtime");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, toCamelCase(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
@@ -2364,7 +2432,7 @@ require("./runtime");
         function initPxTransform() {}
         var taro = "taro";
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -2422,7 +2490,7 @@ require("./runtime");
         return __webpack_require__(__webpack_require__.s = moduleId);
     };
     __webpack_require__.O(0, [ 216, 592 ], (function() {
-        return __webpack_exec__(662);
+        return __webpack_exec__(845);
     }));
     var __webpack_exports__ = __webpack_require__.O();
 } ]);
@@ -3224,7 +3292,7 @@ require("./runtime");
     213: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
         var taro_runtime = __webpack_require__(184);
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -3473,34 +3541,20 @@ module.exports = {
             }
         }
     },
-    815: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+    599: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
                 return _createClass;
             }
         });
-        var esm_typeof = __webpack_require__(671);
-        function _toPrimitive(input, hint) {
-            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
-            var prim = input[Symbol.toPrimitive];
-            if (prim !== undefined) {
-                var res = prim.call(input, hint || "default");
-                if ((0, esm_typeof.Z)(res) !== "object") return res;
-                throw new TypeError("@@toPrimitive must return a primitive value.");
-            }
-            return (hint === "string" ? String : Number)(input);
-        }
-        function _toPropertyKey(arg) {
-            var key = _toPrimitive(arg, "string");
-            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
-        }
+        var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(25);
         function _defineProperties(target, props) {
             for (var i = 0; i < props.length; i++) {
                 var descriptor = props[i];
                 descriptor.enumerable = descriptor.enumerable || false;
                 descriptor.configurable = true;
                 if ("value" in descriptor) descriptor.writable = true;
-                Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
+                Object.defineProperty(target, (0, _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__.Z)(descriptor.key), descriptor);
             }
         }
         function _createClass(Constructor, protoProps, staticProps) {
@@ -3594,6 +3648,28 @@ module.exports = {
             if (superClass) _setPrototypeOf(subClass, superClass);
         }
     },
+    25: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+        __webpack_require__.d(__webpack_exports__, {
+            Z: function() {
+                return _toPropertyKey;
+            }
+        });
+        var esm_typeof = __webpack_require__(671);
+        function _toPrimitive(input, hint) {
+            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
+            var prim = input[Symbol.toPrimitive];
+            if (prim !== undefined) {
+                var res = prim.call(input, hint || "default");
+                if ((0, esm_typeof.Z)(res) !== "object") return res;
+                throw new TypeError("@@toPrimitive must return a primitive value.");
+            }
+            return (hint === "string" ? String : Number)(input);
+        }
+        function _toPropertyKey(arg) {
+            var key = _toPrimitive(arg, "string");
+            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
+        }
+    },
     671: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
@@ -3783,7 +3859,22 @@ require("./vendors");
 require("./runtime");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 143 ], {
-    662: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+    845: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+        var toPropertyKey = __webpack_require__(25);
+        function _defineProperty(obj, key, value) {
+            key = (0, toPropertyKey.Z)(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         function mergeReconciler() {}
         function mergeInternalComponents() {}
         function isArray() {}
@@ -4184,7 +4275,7 @@ require("./runtime");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -4194,10 +4285,12 @@ require("./runtime");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -4266,6 +4359,19 @@ require("./runtime");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, toCamelCase(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
@@ -4304,7 +4410,7 @@ require("./runtime");
         function initPxTransform() {}
         var taro = "taro";
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -4362,7 +4468,7 @@ require("./runtime");
         return __webpack_require__(__webpack_require__.s = moduleId);
     };
     __webpack_require__.O(0, [ 216, 592 ], (function() {
-        return __webpack_exec__(662);
+        return __webpack_exec__(845);
     }));
     var __webpack_exports__ = __webpack_require__.O();
 } ]);
@@ -5168,7 +5274,7 @@ I m irrelevant.
     213: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
         var taro_runtime = __webpack_require__(184);
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -5302,34 +5408,20 @@ module.exports = {
             }
         }
     },
-    815: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+    599: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
                 return _createClass;
             }
         });
-        var esm_typeof = __webpack_require__(671);
-        function _toPrimitive(input, hint) {
-            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
-            var prim = input[Symbol.toPrimitive];
-            if (prim !== undefined) {
-                var res = prim.call(input, hint || "default");
-                if ((0, esm_typeof.Z)(res) !== "object") return res;
-                throw new TypeError("@@toPrimitive must return a primitive value.");
-            }
-            return (hint === "string" ? String : Number)(input);
-        }
-        function _toPropertyKey(arg) {
-            var key = _toPrimitive(arg, "string");
-            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
-        }
+        var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(25);
         function _defineProperties(target, props) {
             for (var i = 0; i < props.length; i++) {
                 var descriptor = props[i];
                 descriptor.enumerable = descriptor.enumerable || false;
                 descriptor.configurable = true;
                 if ("value" in descriptor) descriptor.writable = true;
-                Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
+                Object.defineProperty(target, (0, _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__.Z)(descriptor.key), descriptor);
             }
         }
         function _createClass(Constructor, protoProps, staticProps) {
@@ -5423,6 +5515,28 @@ module.exports = {
             if (superClass) _setPrototypeOf(subClass, superClass);
         }
     },
+    25: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+        __webpack_require__.d(__webpack_exports__, {
+            Z: function() {
+                return _toPropertyKey;
+            }
+        });
+        var esm_typeof = __webpack_require__(671);
+        function _toPrimitive(input, hint) {
+            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
+            var prim = input[Symbol.toPrimitive];
+            if (prim !== undefined) {
+                var res = prim.call(input, hint || "default");
+                if ((0, esm_typeof.Z)(res) !== "object") return res;
+                throw new TypeError("@@toPrimitive must return a primitive value.");
+            }
+            return (hint === "string" ? String : Number)(input);
+        }
+        function _toPropertyKey(arg) {
+            var key = _toPrimitive(arg, "string");
+            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
+        }
+    },
     671: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
@@ -5624,7 +5738,22 @@ require("./vendors");
 require("./runtime");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 143 ], {
-    662: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+    845: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+        var toPropertyKey = __webpack_require__(25);
+        function _defineProperty(obj, key, value) {
+            key = (0, toPropertyKey.Z)(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         function mergeReconciler() {}
         function mergeInternalComponents() {}
         function isArray() {}
@@ -6025,7 +6154,7 @@ require("./runtime");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -6035,10 +6164,12 @@ require("./runtime");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -6107,6 +6238,19 @@ require("./runtime");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, toCamelCase(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
@@ -6145,7 +6289,7 @@ require("./runtime");
         function initPxTransform() {}
         var taro = "taro";
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -6203,7 +6347,7 @@ require("./runtime");
         return __webpack_require__(__webpack_require__.s = moduleId);
     };
     __webpack_require__.O(0, [ 216, 592 ], (function() {
-        return __webpack_exec__(662);
+        return __webpack_exec__(845);
     }));
     var __webpack_exports__ = __webpack_require__.O();
 } ]);
@@ -7005,7 +7149,7 @@ require("./runtime");
     213: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
         var taro_runtime = __webpack_require__(184);
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -7139,34 +7283,20 @@ module.exports = {
             }
         }
     },
-    815: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+    599: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
                 return _createClass;
             }
         });
-        var esm_typeof = __webpack_require__(671);
-        function _toPrimitive(input, hint) {
-            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
-            var prim = input[Symbol.toPrimitive];
-            if (prim !== undefined) {
-                var res = prim.call(input, hint || "default");
-                if ((0, esm_typeof.Z)(res) !== "object") return res;
-                throw new TypeError("@@toPrimitive must return a primitive value.");
-            }
-            return (hint === "string" ? String : Number)(input);
-        }
-        function _toPropertyKey(arg) {
-            var key = _toPrimitive(arg, "string");
-            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
-        }
+        var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(25);
         function _defineProperties(target, props) {
             for (var i = 0; i < props.length; i++) {
                 var descriptor = props[i];
                 descriptor.enumerable = descriptor.enumerable || false;
                 descriptor.configurable = true;
                 if ("value" in descriptor) descriptor.writable = true;
-                Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
+                Object.defineProperty(target, (0, _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__.Z)(descriptor.key), descriptor);
             }
         }
         function _createClass(Constructor, protoProps, staticProps) {
@@ -7260,6 +7390,28 @@ module.exports = {
             if (superClass) _setPrototypeOf(subClass, superClass);
         }
     },
+    25: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+        __webpack_require__.d(__webpack_exports__, {
+            Z: function() {
+                return _toPropertyKey;
+            }
+        });
+        var esm_typeof = __webpack_require__(671);
+        function _toPrimitive(input, hint) {
+            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
+            var prim = input[Symbol.toPrimitive];
+            if (prim !== undefined) {
+                var res = prim.call(input, hint || "default");
+                if ((0, esm_typeof.Z)(res) !== "object") return res;
+                throw new TypeError("@@toPrimitive must return a primitive value.");
+            }
+            return (hint === "string" ? String : Number)(input);
+        }
+        function _toPropertyKey(arg) {
+            var key = _toPrimitive(arg, "string");
+            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
+        }
+    },
     671: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
diff --git a/packages/taro-webpack5-runner/src/__tests__/__snapshots__/css-modules.spec.ts.snap b/packages/taro-webpack5-runner/src/__tests__/__snapshots__/css-modules.spec.ts.snap
index d3ea080e412..62028cd8038 100644
--- a/packages/taro-webpack5-runner/src/__tests__/__snapshots__/css-modules.spec.ts.snap
+++ b/packages/taro-webpack5-runner/src/__tests__/__snapshots__/css-modules.spec.ts.snap
@@ -14,7 +14,22 @@ require("./vendors");
 require("./runtime");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 143 ], {
-    14: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+    816: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+        var toPropertyKey = __webpack_require__(25);
+        function _defineProperty(obj, key, value) {
+            key = (0, toPropertyKey.Z)(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         function mergeReconciler() {}
         function mergeInternalComponents() {}
         function isArray() {}
@@ -415,7 +430,7 @@ require("./runtime");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -425,10 +440,12 @@ require("./runtime");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -497,6 +514,19 @@ require("./runtime");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, toCamelCase(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
@@ -535,7 +565,7 @@ require("./runtime");
         function initPxTransform() {}
         var taro = "taro";
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -594,7 +624,7 @@ require("./runtime");
         return __webpack_require__(__webpack_require__.s = moduleId);
     };
     __webpack_require__.O(0, [ 216, 592 ], (function() {
-        return __webpack_exec__(14);
+        return __webpack_exec__(816);
     }));
     var __webpack_exports__ = __webpack_require__.O();
 } ]);
@@ -1396,7 +1426,7 @@ require("./runtime");
     483: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
         var taro_runtime = __webpack_require__(184);
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -1540,34 +1570,20 @@ module.exports = {
             }
         }
     },
-    815: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+    599: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
                 return _createClass;
             }
         });
-        var esm_typeof = __webpack_require__(671);
-        function _toPrimitive(input, hint) {
-            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
-            var prim = input[Symbol.toPrimitive];
-            if (prim !== undefined) {
-                var res = prim.call(input, hint || "default");
-                if ((0, esm_typeof.Z)(res) !== "object") return res;
-                throw new TypeError("@@toPrimitive must return a primitive value.");
-            }
-            return (hint === "string" ? String : Number)(input);
-        }
-        function _toPropertyKey(arg) {
-            var key = _toPrimitive(arg, "string");
-            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
-        }
+        var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(25);
         function _defineProperties(target, props) {
             for (var i = 0; i < props.length; i++) {
                 var descriptor = props[i];
                 descriptor.enumerable = descriptor.enumerable || false;
                 descriptor.configurable = true;
                 if ("value" in descriptor) descriptor.writable = true;
-                Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
+                Object.defineProperty(target, (0, _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__.Z)(descriptor.key), descriptor);
             }
         }
         function _createClass(Constructor, protoProps, staticProps) {
@@ -1661,6 +1677,28 @@ module.exports = {
             if (superClass) _setPrototypeOf(subClass, superClass);
         }
     },
+    25: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+        __webpack_require__.d(__webpack_exports__, {
+            Z: function() {
+                return _toPropertyKey;
+            }
+        });
+        var esm_typeof = __webpack_require__(671);
+        function _toPrimitive(input, hint) {
+            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
+            var prim = input[Symbol.toPrimitive];
+            if (prim !== undefined) {
+                var res = prim.call(input, hint || "default");
+                if ((0, esm_typeof.Z)(res) !== "object") return res;
+                throw new TypeError("@@toPrimitive must return a primitive value.");
+            }
+            return (hint === "string" ? String : Number)(input);
+        }
+        function _toPropertyKey(arg) {
+            var key = _toPrimitive(arg, "string");
+            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
+        }
+    },
     671: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
@@ -1851,7 +1889,22 @@ require("./vendors");
 require("./runtime");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 143 ], {
-    707: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+    442: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+        var toPropertyKey = __webpack_require__(25);
+        function _defineProperty(obj, key, value) {
+            key = (0, toPropertyKey.Z)(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         function mergeReconciler() {}
         function mergeInternalComponents() {}
         function isArray() {}
@@ -2252,7 +2305,7 @@ require("./runtime");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -2262,10 +2315,12 @@ require("./runtime");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -2334,6 +2389,19 @@ require("./runtime");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, toCamelCase(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
@@ -2372,7 +2440,7 @@ require("./runtime");
         function initPxTransform() {}
         var taro = "taro";
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -2430,7 +2498,7 @@ require("./runtime");
         return __webpack_require__(__webpack_require__.s = moduleId);
     };
     __webpack_require__.O(0, [ 216, 592 ], (function() {
-        return __webpack_exec__(707);
+        return __webpack_exec__(442);
     }));
     var __webpack_exports__ = __webpack_require__.O();
 } ]);
@@ -3234,7 +3302,7 @@ require("./runtime");
         __webpack_require__.r(index_namespaceObject);
         var taro_runtime = __webpack_require__(184);
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -3375,34 +3443,20 @@ module.exports = {
             }
         }
     },
-    815: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+    599: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
                 return _createClass;
             }
         });
-        var esm_typeof = __webpack_require__(671);
-        function _toPrimitive(input, hint) {
-            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
-            var prim = input[Symbol.toPrimitive];
-            if (prim !== undefined) {
-                var res = prim.call(input, hint || "default");
-                if ((0, esm_typeof.Z)(res) !== "object") return res;
-                throw new TypeError("@@toPrimitive must return a primitive value.");
-            }
-            return (hint === "string" ? String : Number)(input);
-        }
-        function _toPropertyKey(arg) {
-            var key = _toPrimitive(arg, "string");
-            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
-        }
+        var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(25);
         function _defineProperties(target, props) {
             for (var i = 0; i < props.length; i++) {
                 var descriptor = props[i];
                 descriptor.enumerable = descriptor.enumerable || false;
                 descriptor.configurable = true;
                 if ("value" in descriptor) descriptor.writable = true;
-                Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
+                Object.defineProperty(target, (0, _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__.Z)(descriptor.key), descriptor);
             }
         }
         function _createClass(Constructor, protoProps, staticProps) {
@@ -3496,6 +3550,28 @@ module.exports = {
             if (superClass) _setPrototypeOf(subClass, superClass);
         }
     },
+    25: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+        __webpack_require__.d(__webpack_exports__, {
+            Z: function() {
+                return _toPropertyKey;
+            }
+        });
+        var esm_typeof = __webpack_require__(671);
+        function _toPrimitive(input, hint) {
+            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
+            var prim = input[Symbol.toPrimitive];
+            if (prim !== undefined) {
+                var res = prim.call(input, hint || "default");
+                if ((0, esm_typeof.Z)(res) !== "object") return res;
+                throw new TypeError("@@toPrimitive must return a primitive value.");
+            }
+            return (hint === "string" ? String : Number)(input);
+        }
+        function _toPropertyKey(arg) {
+            var key = _toPrimitive(arg, "string");
+            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
+        }
+    },
     671: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
diff --git a/packages/taro-webpack5-runner/src/__tests__/__snapshots__/framework.spec.ts.snap b/packages/taro-webpack5-runner/src/__tests__/__snapshots__/framework.spec.ts.snap
index af709685d8c..f1b0cd4dc3e 100644
--- a/packages/taro-webpack5-runner/src/__tests__/__snapshots__/framework.spec.ts.snap
+++ b/packages/taro-webpack5-runner/src/__tests__/__snapshots__/framework.spec.ts.snap
@@ -14,7 +14,22 @@ require("./vendors");
 require("./runtime");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 143 ], {
-    106: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+    811: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+        var toPropertyKey = __webpack_require__(25);
+        function _defineProperty(obj, key, value) {
+            key = (0, toPropertyKey.Z)(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         function mergeReconciler() {}
         function mergeInternalComponents() {}
         function isArray() {}
@@ -412,7 +427,7 @@ require("./runtime");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -422,10 +437,12 @@ require("./runtime");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -494,6 +511,19 @@ require("./runtime");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, toCamelCase(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
@@ -532,7 +562,7 @@ require("./runtime");
         function initPxTransform() {}
         var taro = "taro";
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var nerv = __webpack_require__(366);
@@ -589,7 +619,7 @@ require("./runtime");
         return __webpack_require__(__webpack_require__.s = moduleId);
     };
     __webpack_require__.O(0, [ 216, 592 ], (function() {
-        return __webpack_exec__(106);
+        return __webpack_exec__(811);
     }));
     var __webpack_exports__ = __webpack_require__.O();
 } ]);
@@ -1622,7 +1652,7 @@ require("./runtime");
     934: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
         var taro_runtime = __webpack_require__(184);
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var nerv = __webpack_require__(366);
@@ -1757,34 +1787,20 @@ module.exports = {
             }
         }
     },
-    815: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+    599: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
                 return _createClass;
             }
         });
-        var esm_typeof = __webpack_require__(671);
-        function _toPrimitive(input, hint) {
-            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
-            var prim = input[Symbol.toPrimitive];
-            if (prim !== undefined) {
-                var res = prim.call(input, hint || "default");
-                if ((0, esm_typeof.Z)(res) !== "object") return res;
-                throw new TypeError("@@toPrimitive must return a primitive value.");
-            }
-            return (hint === "string" ? String : Number)(input);
-        }
-        function _toPropertyKey(arg) {
-            var key = _toPrimitive(arg, "string");
-            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
-        }
+        var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(25);
         function _defineProperties(target, props) {
             for (var i = 0; i < props.length; i++) {
                 var descriptor = props[i];
                 descriptor.enumerable = descriptor.enumerable || false;
                 descriptor.configurable = true;
                 if ("value" in descriptor) descriptor.writable = true;
-                Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
+                Object.defineProperty(target, (0, _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__.Z)(descriptor.key), descriptor);
             }
         }
         function _createClass(Constructor, protoProps, staticProps) {
@@ -1878,6 +1894,28 @@ module.exports = {
             if (superClass) _setPrototypeOf(subClass, superClass);
         }
     },
+    25: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+        __webpack_require__.d(__webpack_exports__, {
+            Z: function() {
+                return _toPropertyKey;
+            }
+        });
+        var esm_typeof = __webpack_require__(671);
+        function _toPrimitive(input, hint) {
+            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
+            var prim = input[Symbol.toPrimitive];
+            if (prim !== undefined) {
+                var res = prim.call(input, hint || "default");
+                if ((0, esm_typeof.Z)(res) !== "object") return res;
+                throw new TypeError("@@toPrimitive must return a primitive value.");
+            }
+            return (hint === "string" ? String : Number)(input);
+        }
+        function _toPropertyKey(arg) {
+            var key = _toPrimitive(arg, "string");
+            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
+        }
+    },
     671: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
@@ -2067,7 +2105,22 @@ require("./vendors");
 require("./runtime");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 143 ], {
-    707: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+    442: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+        var toPropertyKey = __webpack_require__(25);
+        function _defineProperty(obj, key, value) {
+            key = (0, toPropertyKey.Z)(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         function mergeReconciler() {}
         function mergeInternalComponents() {}
         function isArray() {}
@@ -2468,7 +2521,7 @@ require("./runtime");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -2478,10 +2531,12 @@ require("./runtime");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -2550,6 +2605,19 @@ require("./runtime");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, toCamelCase(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
@@ -2588,7 +2656,7 @@ require("./runtime");
         function initPxTransform() {}
         var taro = "taro";
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -2646,7 +2714,7 @@ require("./runtime");
         return __webpack_require__(__webpack_require__.s = moduleId);
     };
     __webpack_require__.O(0, [ 216, 592 ], (function() {
-        return __webpack_exec__(707);
+        return __webpack_exec__(442);
     }));
     var __webpack_exports__ = __webpack_require__.O();
 } ]);
@@ -4016,7 +4084,7 @@ require("./runtime");
             };
         }
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -4181,34 +4249,20 @@ module.exports = {
             }
         }
     },
-    815: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+    599: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
                 return _createClass;
             }
         });
-        var esm_typeof = __webpack_require__(671);
-        function _toPrimitive(input, hint) {
-            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
-            var prim = input[Symbol.toPrimitive];
-            if (prim !== undefined) {
-                var res = prim.call(input, hint || "default");
-                if ((0, esm_typeof.Z)(res) !== "object") return res;
-                throw new TypeError("@@toPrimitive must return a primitive value.");
-            }
-            return (hint === "string" ? String : Number)(input);
-        }
-        function _toPropertyKey(arg) {
-            var key = _toPrimitive(arg, "string");
-            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
-        }
+        var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(25);
         function _defineProperties(target, props) {
             for (var i = 0; i < props.length; i++) {
                 var descriptor = props[i];
                 descriptor.enumerable = descriptor.enumerable || false;
                 descriptor.configurable = true;
                 if ("value" in descriptor) descriptor.writable = true;
-                Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
+                Object.defineProperty(target, (0, _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__.Z)(descriptor.key), descriptor);
             }
         }
         function _createClass(Constructor, protoProps, staticProps) {
@@ -4302,6 +4356,28 @@ module.exports = {
             if (superClass) _setPrototypeOf(subClass, superClass);
         }
     },
+    25: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+        __webpack_require__.d(__webpack_exports__, {
+            Z: function() {
+                return _toPropertyKey;
+            }
+        });
+        var esm_typeof = __webpack_require__(671);
+        function _toPrimitive(input, hint) {
+            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
+            var prim = input[Symbol.toPrimitive];
+            if (prim !== undefined) {
+                var res = prim.call(input, hint || "default");
+                if ((0, esm_typeof.Z)(res) !== "object") return res;
+                throw new TypeError("@@toPrimitive must return a primitive value.");
+            }
+            return (hint === "string" ? String : Number)(input);
+        }
+        function _toPropertyKey(arg) {
+            var key = _toPrimitive(arg, "string");
+            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
+        }
+    },
     671: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
@@ -4489,7 +4565,43 @@ require("./common");
 require("./runtime");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 143 ], {
-    440: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+    95: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+        function _typeof(obj) {
+            "@babel/helpers - typeof";
+            return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(obj) {
+                return typeof obj;
+            } : function(obj) {
+                return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
+            }, _typeof(obj);
+        }
+        function _toPrimitive(input, hint) {
+            if (_typeof(input) !== "object" || input === null) return input;
+            var prim = input[Symbol.toPrimitive];
+            if (prim !== undefined) {
+                var res = prim.call(input, hint || "default");
+                if (_typeof(res) !== "object") return res;
+                throw new TypeError("@@toPrimitive must return a primitive value.");
+            }
+            return (hint === "string" ? String : Number)(input);
+        }
+        function _toPropertyKey(arg) {
+            var key = _toPrimitive(arg, "string");
+            return _typeof(key) === "symbol" ? key : String(key);
+        }
+        function _defineProperty(obj, key, value) {
+            key = _toPropertyKey(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         function mergeReconciler() {}
         function mergeInternalComponents() {}
         function isArray() {}
@@ -4887,7 +4999,7 @@ require("./runtime");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -4897,10 +5009,12 @@ require("./runtime");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -4969,6 +5083,19 @@ require("./runtime");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, toCamelCase(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
@@ -5044,7 +5171,7 @@ require("./runtime");
         return __webpack_require__(__webpack_require__.s = moduleId);
     };
     __webpack_require__.O(0, [ 592 ], (function() {
-        return __webpack_exec__(440);
+        return __webpack_exec__(95);
     }));
     var __webpack_exports__ = __webpack_require__.O();
 } ]);
@@ -6249,7 +6376,43 @@ require("./common");
 require("./runtime");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 143 ], {
-    122: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+    578: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+        function _typeof(obj) {
+            "@babel/helpers - typeof";
+            return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(obj) {
+                return typeof obj;
+            } : function(obj) {
+                return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
+            }, _typeof(obj);
+        }
+        function _toPrimitive(input, hint) {
+            if (_typeof(input) !== "object" || input === null) return input;
+            var prim = input[Symbol.toPrimitive];
+            if (prim !== undefined) {
+                var res = prim.call(input, hint || "default");
+                if (_typeof(res) !== "object") return res;
+                throw new TypeError("@@toPrimitive must return a primitive value.");
+            }
+            return (hint === "string" ? String : Number)(input);
+        }
+        function _toPropertyKey(arg) {
+            var key = _toPrimitive(arg, "string");
+            return _typeof(key) === "symbol" ? key : String(key);
+        }
+        function _defineProperty(obj, key, value) {
+            key = _toPropertyKey(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         function mergeReconciler() {}
         function mergeInternalComponents() {}
         function isArray() {}
@@ -6647,7 +6810,7 @@ require("./runtime");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -6657,10 +6820,12 @@ require("./runtime");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -6729,6 +6894,19 @@ require("./runtime");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, toCamelCase(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
@@ -6799,7 +6977,7 @@ require("./runtime");
         return __webpack_require__(__webpack_require__.s = moduleId);
     };
     __webpack_require__.O(0, [ 592 ], (function() {
-        return __webpack_exec__(122);
+        return __webpack_exec__(578);
     }));
     var __webpack_exports__ = __webpack_require__.O();
 } ]);
diff --git a/packages/taro-webpack5-runner/src/__tests__/__snapshots__/mini-platform.spec.ts.snap b/packages/taro-webpack5-runner/src/__tests__/__snapshots__/mini-platform.spec.ts.snap
index 6f04d0fb144..c987d9d97a5 100644
--- a/packages/taro-webpack5-runner/src/__tests__/__snapshots__/mini-platform.spec.ts.snap
+++ b/packages/taro-webpack5-runner/src/__tests__/__snapshots__/mini-platform.spec.ts.snap
@@ -17,7 +17,22 @@ require("./vendors");
 require("./runtime");
 
 (my["webpackJsonp"] = my["webpackJsonp"] || []).push([ [ 143 ], {
-    162: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+    271: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+        var toPropertyKey = __webpack_require__(25);
+        function _defineProperty(obj, key, value) {
+            key = (0, toPropertyKey.Z)(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         function mergeReconciler() {}
         function mergeInternalComponents() {}
         function isArray() {}
@@ -728,6 +743,18 @@ require("./runtime");
             },
             RootPortal: {
                 enable: "true"
+            },
+            PageMeta: {
+                "background-color": "",
+                "background-color-top": "",
+                "background-color-bottom": "",
+                "root-background-color": "",
+                "scroll-top": "''",
+                "scroll-duration": "300",
+                "page-style": "''",
+                "root-font-size": "''",
+                "page-font-size": "''",
+                bindScroll: ""
             }
         };
         var BUBBLE_EVENTS = new Set([ "touchStart", "touchMove", "touchEnd", "touchCancel", "tap", "longTap" ]);
@@ -751,6 +778,19 @@ require("./runtime");
             },
             isBubbleEvents: function isBubbleEvents(eventName) {
                 return BUBBLE_EVENTS.has(eventName);
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, toCamelCase(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         var _navigator = runtime_navigator, userAgent = _navigator.userAgent;
@@ -797,7 +837,7 @@ require("./runtime");
         function initPxTransform() {}
         var taro = "taro";
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -855,7 +895,7 @@ require("./runtime");
         return __webpack_require__(__webpack_require__.s = moduleId);
     };
     __webpack_require__.O(0, [ 216, 592 ], (function() {
-        return __webpack_exec__(162);
+        return __webpack_exec__(271);
     }));
     var __webpack_exports__ = __webpack_require__.O();
 } ]);
@@ -1406,7 +1446,7 @@ require("./runtime");
             };
         }
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -1543,34 +1583,20 @@ export default {
             }
         }
     },
-    815: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+    599: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
                 return _createClass;
             }
         });
-        var esm_typeof = __webpack_require__(671);
-        function _toPrimitive(input, hint) {
-            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
-            var prim = input[Symbol.toPrimitive];
-            if (prim !== undefined) {
-                var res = prim.call(input, hint || "default");
-                if ((0, esm_typeof.Z)(res) !== "object") return res;
-                throw new TypeError("@@toPrimitive must return a primitive value.");
-            }
-            return (hint === "string" ? String : Number)(input);
-        }
-        function _toPropertyKey(arg) {
-            var key = _toPrimitive(arg, "string");
-            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
-        }
+        var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(25);
         function _defineProperties(target, props) {
             for (var i = 0; i < props.length; i++) {
                 var descriptor = props[i];
                 descriptor.enumerable = descriptor.enumerable || false;
                 descriptor.configurable = true;
                 if ("value" in descriptor) descriptor.writable = true;
-                Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
+                Object.defineProperty(target, (0, _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__.Z)(descriptor.key), descriptor);
             }
         }
         function _createClass(Constructor, protoProps, staticProps) {
@@ -1664,6 +1690,28 @@ export default {
             if (superClass) _setPrototypeOf(subClass, superClass);
         }
     },
+    25: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+        __webpack_require__.d(__webpack_exports__, {
+            Z: function() {
+                return _toPropertyKey;
+            }
+        });
+        var esm_typeof = __webpack_require__(671);
+        function _toPrimitive(input, hint) {
+            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
+            var prim = input[Symbol.toPrimitive];
+            if (prim !== undefined) {
+                var res = prim.call(input, hint || "default");
+                if ((0, esm_typeof.Z)(res) !== "object") return res;
+                throw new TypeError("@@toPrimitive must return a primitive value.");
+            }
+            return (hint === "string" ? String : Number)(input);
+        }
+        function _toPropertyKey(arg) {
+            var key = _toPrimitive(arg, "string");
+            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
+        }
+    },
     671: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
diff --git a/packages/taro-webpack5-runner/src/__tests__/__snapshots__/parse-html.spec.ts.snap b/packages/taro-webpack5-runner/src/__tests__/__snapshots__/parse-html.spec.ts.snap
index 3eda59a35f2..d58a01ce001 100644
--- a/packages/taro-webpack5-runner/src/__tests__/__snapshots__/parse-html.spec.ts.snap
+++ b/packages/taro-webpack5-runner/src/__tests__/__snapshots__/parse-html.spec.ts.snap
@@ -14,7 +14,22 @@ require("./vendors");
 require("./runtime");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 143 ], {
-    707: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+    442: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+        var toPropertyKey = __webpack_require__(25);
+        function _defineProperty(obj, key, value) {
+            key = (0, toPropertyKey.Z)(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         function mergeReconciler() {}
         function mergeInternalComponents() {}
         function isArray() {}
@@ -412,7 +427,7 @@ require("./runtime");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -422,10 +437,12 @@ require("./runtime");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -494,6 +511,19 @@ require("./runtime");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, toCamelCase(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
@@ -532,7 +562,7 @@ require("./runtime");
         function initPxTransform() {}
         var taro = "taro";
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -590,7 +620,7 @@ require("./runtime");
         return __webpack_require__(__webpack_require__.s = moduleId);
     };
     __webpack_require__.O(0, [ 216, 592 ], (function() {
-        return __webpack_exec__(707);
+        return __webpack_exec__(442);
     }));
     var __webpack_exports__ = __webpack_require__.O();
 } ]);
@@ -1392,7 +1422,7 @@ require("./runtime");
     934: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
         var taro_runtime = __webpack_require__(184);
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -1520,34 +1550,20 @@ module.exports = {
             }
         }
     },
-    815: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+    599: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
                 return _createClass;
             }
         });
-        var esm_typeof = __webpack_require__(671);
-        function _toPrimitive(input, hint) {
-            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
-            var prim = input[Symbol.toPrimitive];
-            if (prim !== undefined) {
-                var res = prim.call(input, hint || "default");
-                if ((0, esm_typeof.Z)(res) !== "object") return res;
-                throw new TypeError("@@toPrimitive must return a primitive value.");
-            }
-            return (hint === "string" ? String : Number)(input);
-        }
-        function _toPropertyKey(arg) {
-            var key = _toPrimitive(arg, "string");
-            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
-        }
+        var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(25);
         function _defineProperties(target, props) {
             for (var i = 0; i < props.length; i++) {
                 var descriptor = props[i];
                 descriptor.enumerable = descriptor.enumerable || false;
                 descriptor.configurable = true;
                 if ("value" in descriptor) descriptor.writable = true;
-                Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
+                Object.defineProperty(target, (0, _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__.Z)(descriptor.key), descriptor);
             }
         }
         function _createClass(Constructor, protoProps, staticProps) {
@@ -1641,6 +1657,28 @@ module.exports = {
             if (superClass) _setPrototypeOf(subClass, superClass);
         }
     },
+    25: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+        __webpack_require__.d(__webpack_exports__, {
+            Z: function() {
+                return _toPropertyKey;
+            }
+        });
+        var esm_typeof = __webpack_require__(671);
+        function _toPrimitive(input, hint) {
+            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
+            var prim = input[Symbol.toPrimitive];
+            if (prim !== undefined) {
+                var res = prim.call(input, hint || "default");
+                if ((0, esm_typeof.Z)(res) !== "object") return res;
+                throw new TypeError("@@toPrimitive must return a primitive value.");
+            }
+            return (hint === "string" ? String : Number)(input);
+        }
+        function _toPropertyKey(arg) {
+            var key = _toPrimitive(arg, "string");
+            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
+        }
+    },
     671: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
diff --git a/packages/taro-webpack5-runner/src/__tests__/__snapshots__/prerender.spec.ts.snap b/packages/taro-webpack5-runner/src/__tests__/__snapshots__/prerender.spec.ts.snap
index 65de2e54370..d98b38a3574 100644
--- a/packages/taro-webpack5-runner/src/__tests__/__snapshots__/prerender.spec.ts.snap
+++ b/packages/taro-webpack5-runner/src/__tests__/__snapshots__/prerender.spec.ts.snap
@@ -15,6 +15,7 @@ require("./runtime");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 143 ], {
     707: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+        var defineProperty = __webpack_require__(365);
         function mergeReconciler() {}
         function mergeInternalComponents() {}
         function isArray() {}
@@ -412,7 +413,7 @@ require("./runtime");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -422,10 +423,12 @@ require("./runtime");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -494,6 +497,19 @@ require("./runtime");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData((0, defineProperty.Z)({}, toCamelCase(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, (0, defineProperty.Z)(_ref, "v", ""), (0, defineProperty.Z)(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
@@ -3109,6 +3125,7 @@ require("./runtime");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 143 ], {
     707: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+        var defineProperty = __webpack_require__(365);
         function mergeReconciler() {}
         function mergeInternalComponents() {}
         function isArray() {}
@@ -3506,7 +3523,7 @@ require("./runtime");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -3516,10 +3533,12 @@ require("./runtime");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -3588,6 +3607,19 @@ require("./runtime");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData((0, defineProperty.Z)({}, toCamelCase(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, (0, defineProperty.Z)(_ref, "v", ""), (0, defineProperty.Z)(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
@@ -6203,6 +6235,7 @@ require("./runtime");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 143 ], {
     707: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+        var defineProperty = __webpack_require__(365);
         function mergeReconciler() {}
         function mergeInternalComponents() {}
         function isArray() {}
@@ -6600,7 +6633,7 @@ require("./runtime");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -6610,10 +6643,12 @@ require("./runtime");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -6682,6 +6717,19 @@ require("./runtime");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData((0, defineProperty.Z)({}, toCamelCase(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, (0, defineProperty.Z)(_ref, "v", ""), (0, defineProperty.Z)(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
diff --git a/packages/taro-webpack5-runner/src/__tests__/__snapshots__/sass.spec.ts.snap b/packages/taro-webpack5-runner/src/__tests__/__snapshots__/sass.spec.ts.snap
index 4574da394b0..4a8af9ddeb9 100644
--- a/packages/taro-webpack5-runner/src/__tests__/__snapshots__/sass.spec.ts.snap
+++ b/packages/taro-webpack5-runner/src/__tests__/__snapshots__/sass.spec.ts.snap
@@ -14,7 +14,22 @@ require("./vendors");
 require("./runtime");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 143 ], {
-    187: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+    560: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+        var toPropertyKey = __webpack_require__(25);
+        function _defineProperty(obj, key, value) {
+            key = (0, toPropertyKey.Z)(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         function mergeReconciler() {}
         function mergeInternalComponents() {}
         function isArray() {}
@@ -415,7 +430,7 @@ require("./runtime");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -425,10 +440,12 @@ require("./runtime");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -497,6 +514,19 @@ require("./runtime");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, toCamelCase(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
@@ -535,7 +565,7 @@ require("./runtime");
         function initPxTransform() {}
         var taro = "taro";
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -584,7 +614,7 @@ require("./runtime");
         return __webpack_require__(__webpack_require__.s = moduleId);
     };
     __webpack_require__.O(0, [ 216, 592 ], (function() {
-        return __webpack_exec__(187);
+        return __webpack_exec__(560);
     }));
     var __webpack_exports__ = __webpack_require__.O();
 } ]);
@@ -1383,7 +1413,7 @@ require("./runtime");
     996: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
         var taro_runtime = __webpack_require__(184);
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -1506,34 +1536,20 @@ module.exports = {
             }
         }
     },
-    815: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+    599: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
                 return _createClass;
             }
         });
-        var esm_typeof = __webpack_require__(671);
-        function _toPrimitive(input, hint) {
-            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
-            var prim = input[Symbol.toPrimitive];
-            if (prim !== undefined) {
-                var res = prim.call(input, hint || "default");
-                if ((0, esm_typeof.Z)(res) !== "object") return res;
-                throw new TypeError("@@toPrimitive must return a primitive value.");
-            }
-            return (hint === "string" ? String : Number)(input);
-        }
-        function _toPropertyKey(arg) {
-            var key = _toPrimitive(arg, "string");
-            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
-        }
+        var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(25);
         function _defineProperties(target, props) {
             for (var i = 0; i < props.length; i++) {
                 var descriptor = props[i];
                 descriptor.enumerable = descriptor.enumerable || false;
                 descriptor.configurable = true;
                 if ("value" in descriptor) descriptor.writable = true;
-                Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
+                Object.defineProperty(target, (0, _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__.Z)(descriptor.key), descriptor);
             }
         }
         function _createClass(Constructor, protoProps, staticProps) {
@@ -1627,6 +1643,28 @@ module.exports = {
             if (superClass) _setPrototypeOf(subClass, superClass);
         }
     },
+    25: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+        __webpack_require__.d(__webpack_exports__, {
+            Z: function() {
+                return _toPropertyKey;
+            }
+        });
+        var esm_typeof = __webpack_require__(671);
+        function _toPrimitive(input, hint) {
+            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
+            var prim = input[Symbol.toPrimitive];
+            if (prim !== undefined) {
+                var res = prim.call(input, hint || "default");
+                if ((0, esm_typeof.Z)(res) !== "object") return res;
+                throw new TypeError("@@toPrimitive must return a primitive value.");
+            }
+            return (hint === "string" ? String : Number)(input);
+        }
+        function _toPropertyKey(arg) {
+            var key = _toPrimitive(arg, "string");
+            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
+        }
+    },
     671: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
@@ -1804,7 +1842,22 @@ require("./vendors");
 require("./runtime");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 143 ], {
-    707: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+    442: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+        var toPropertyKey = __webpack_require__(25);
+        function _defineProperty(obj, key, value) {
+            key = (0, toPropertyKey.Z)(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         function mergeReconciler() {}
         function mergeInternalComponents() {}
         function isArray() {}
@@ -2205,7 +2258,7 @@ require("./runtime");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -2215,10 +2268,12 @@ require("./runtime");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -2287,6 +2342,19 @@ require("./runtime");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, toCamelCase(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
@@ -2325,7 +2393,7 @@ require("./runtime");
         function initPxTransform() {}
         var taro = "taro";
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -2383,7 +2451,7 @@ require("./runtime");
         return __webpack_require__(__webpack_require__.s = moduleId);
     };
     __webpack_require__.O(0, [ 216, 592 ], (function() {
-        return __webpack_exec__(707);
+        return __webpack_exec__(442);
     }));
     var __webpack_exports__ = __webpack_require__.O();
 } ]);
@@ -3185,7 +3253,7 @@ require("./runtime");
     934: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
         var taro_runtime = __webpack_require__(184);
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -3320,34 +3388,20 @@ module.exports = {
             }
         }
     },
-    815: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+    599: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
                 return _createClass;
             }
         });
-        var esm_typeof = __webpack_require__(671);
-        function _toPrimitive(input, hint) {
-            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
-            var prim = input[Symbol.toPrimitive];
-            if (prim !== undefined) {
-                var res = prim.call(input, hint || "default");
-                if ((0, esm_typeof.Z)(res) !== "object") return res;
-                throw new TypeError("@@toPrimitive must return a primitive value.");
-            }
-            return (hint === "string" ? String : Number)(input);
-        }
-        function _toPropertyKey(arg) {
-            var key = _toPrimitive(arg, "string");
-            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
-        }
+        var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(25);
         function _defineProperties(target, props) {
             for (var i = 0; i < props.length; i++) {
                 var descriptor = props[i];
                 descriptor.enumerable = descriptor.enumerable || false;
                 descriptor.configurable = true;
                 if ("value" in descriptor) descriptor.writable = true;
-                Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
+                Object.defineProperty(target, (0, _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__.Z)(descriptor.key), descriptor);
             }
         }
         function _createClass(Constructor, protoProps, staticProps) {
@@ -3441,6 +3495,28 @@ module.exports = {
             if (superClass) _setPrototypeOf(subClass, superClass);
         }
     },
+    25: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+        __webpack_require__.d(__webpack_exports__, {
+            Z: function() {
+                return _toPropertyKey;
+            }
+        });
+        var esm_typeof = __webpack_require__(671);
+        function _toPrimitive(input, hint) {
+            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
+            var prim = input[Symbol.toPrimitive];
+            if (prim !== undefined) {
+                var res = prim.call(input, hint || "default");
+                if ((0, esm_typeof.Z)(res) !== "object") return res;
+                throw new TypeError("@@toPrimitive must return a primitive value.");
+            }
+            return (hint === "string" ? String : Number)(input);
+        }
+        function _toPropertyKey(arg) {
+            var key = _toPrimitive(arg, "string");
+            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
+        }
+    },
     671: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
@@ -3630,7 +3706,22 @@ require("./vendors");
 require("./runtime");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 143 ], {
-    707: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+    442: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+        var toPropertyKey = __webpack_require__(25);
+        function _defineProperty(obj, key, value) {
+            key = (0, toPropertyKey.Z)(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         function mergeReconciler() {}
         function mergeInternalComponents() {}
         function isArray() {}
@@ -4031,7 +4122,7 @@ require("./runtime");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -4041,10 +4132,12 @@ require("./runtime");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -4113,6 +4206,19 @@ require("./runtime");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, toCamelCase(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
@@ -4151,7 +4257,7 @@ require("./runtime");
         function initPxTransform() {}
         var taro = "taro";
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -4209,7 +4315,7 @@ require("./runtime");
         return __webpack_require__(__webpack_require__.s = moduleId);
     };
     __webpack_require__.O(0, [ 216, 592 ], (function() {
-        return __webpack_exec__(707);
+        return __webpack_exec__(442);
     }));
     var __webpack_exports__ = __webpack_require__.O();
 } ]);
@@ -5011,7 +5117,7 @@ require("./runtime");
     934: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
         var taro_runtime = __webpack_require__(184);
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -5146,34 +5252,20 @@ module.exports = {
             }
         }
     },
-    815: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+    599: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
                 return _createClass;
             }
         });
-        var esm_typeof = __webpack_require__(671);
-        function _toPrimitive(input, hint) {
-            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
-            var prim = input[Symbol.toPrimitive];
-            if (prim !== undefined) {
-                var res = prim.call(input, hint || "default");
-                if ((0, esm_typeof.Z)(res) !== "object") return res;
-                throw new TypeError("@@toPrimitive must return a primitive value.");
-            }
-            return (hint === "string" ? String : Number)(input);
-        }
-        function _toPropertyKey(arg) {
-            var key = _toPrimitive(arg, "string");
-            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
-        }
+        var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(25);
         function _defineProperties(target, props) {
             for (var i = 0; i < props.length; i++) {
                 var descriptor = props[i];
                 descriptor.enumerable = descriptor.enumerable || false;
                 descriptor.configurable = true;
                 if ("value" in descriptor) descriptor.writable = true;
-                Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
+                Object.defineProperty(target, (0, _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__.Z)(descriptor.key), descriptor);
             }
         }
         function _createClass(Constructor, protoProps, staticProps) {
@@ -5267,6 +5359,28 @@ module.exports = {
             if (superClass) _setPrototypeOf(subClass, superClass);
         }
     },
+    25: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+        __webpack_require__.d(__webpack_exports__, {
+            Z: function() {
+                return _toPropertyKey;
+            }
+        });
+        var esm_typeof = __webpack_require__(671);
+        function _toPrimitive(input, hint) {
+            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
+            var prim = input[Symbol.toPrimitive];
+            if (prim !== undefined) {
+                var res = prim.call(input, hint || "default");
+                if ((0, esm_typeof.Z)(res) !== "object") return res;
+                throw new TypeError("@@toPrimitive must return a primitive value.");
+            }
+            return (hint === "string" ? String : Number)(input);
+        }
+        function _toPropertyKey(arg) {
+            var key = _toPrimitive(arg, "string");
+            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
+        }
+    },
     671: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
@@ -5456,7 +5570,22 @@ require("./vendors");
 require("./runtime");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 143 ], {
-    707: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+    442: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+        var toPropertyKey = __webpack_require__(25);
+        function _defineProperty(obj, key, value) {
+            key = (0, toPropertyKey.Z)(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         function mergeReconciler() {}
         function mergeInternalComponents() {}
         function isArray() {}
@@ -5857,7 +5986,7 @@ require("./runtime");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -5867,10 +5996,12 @@ require("./runtime");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -5939,6 +6070,19 @@ require("./runtime");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, toCamelCase(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
@@ -5977,7 +6121,7 @@ require("./runtime");
         function initPxTransform() {}
         var taro = "taro";
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -6035,7 +6179,7 @@ require("./runtime");
         return __webpack_require__(__webpack_require__.s = moduleId);
     };
     __webpack_require__.O(0, [ 216, 592 ], (function() {
-        return __webpack_exec__(707);
+        return __webpack_exec__(442);
     }));
     var __webpack_exports__ = __webpack_require__.O();
 } ]);
@@ -6837,7 +6981,7 @@ require("./runtime");
     934: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
         var taro_runtime = __webpack_require__(184);
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -6972,34 +7116,20 @@ module.exports = {
             }
         }
     },
-    815: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+    599: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
                 return _createClass;
             }
         });
-        var esm_typeof = __webpack_require__(671);
-        function _toPrimitive(input, hint) {
-            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
-            var prim = input[Symbol.toPrimitive];
-            if (prim !== undefined) {
-                var res = prim.call(input, hint || "default");
-                if ((0, esm_typeof.Z)(res) !== "object") return res;
-                throw new TypeError("@@toPrimitive must return a primitive value.");
-            }
-            return (hint === "string" ? String : Number)(input);
-        }
-        function _toPropertyKey(arg) {
-            var key = _toPrimitive(arg, "string");
-            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
-        }
+        var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(25);
         function _defineProperties(target, props) {
             for (var i = 0; i < props.length; i++) {
                 var descriptor = props[i];
                 descriptor.enumerable = descriptor.enumerable || false;
                 descriptor.configurable = true;
                 if ("value" in descriptor) descriptor.writable = true;
-                Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
+                Object.defineProperty(target, (0, _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__.Z)(descriptor.key), descriptor);
             }
         }
         function _createClass(Constructor, protoProps, staticProps) {
@@ -7093,6 +7223,28 @@ module.exports = {
             if (superClass) _setPrototypeOf(subClass, superClass);
         }
     },
+    25: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+        __webpack_require__.d(__webpack_exports__, {
+            Z: function() {
+                return _toPropertyKey;
+            }
+        });
+        var esm_typeof = __webpack_require__(671);
+        function _toPrimitive(input, hint) {
+            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
+            var prim = input[Symbol.toPrimitive];
+            if (prim !== undefined) {
+                var res = prim.call(input, hint || "default");
+                if ((0, esm_typeof.Z)(res) !== "object") return res;
+                throw new TypeError("@@toPrimitive must return a primitive value.");
+            }
+            return (hint === "string" ? String : Number)(input);
+        }
+        function _toPropertyKey(arg) {
+            var key = _toPrimitive(arg, "string");
+            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
+        }
+    },
     671: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
@@ -7282,7 +7434,22 @@ require("./vendors");
 require("./runtime");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 143 ], {
-    707: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+    442: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+        var toPropertyKey = __webpack_require__(25);
+        function _defineProperty(obj, key, value) {
+            key = (0, toPropertyKey.Z)(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         function mergeReconciler() {}
         function mergeInternalComponents() {}
         function isArray() {}
@@ -7683,7 +7850,7 @@ require("./runtime");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -7693,10 +7860,12 @@ require("./runtime");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -7765,6 +7934,19 @@ require("./runtime");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, toCamelCase(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
@@ -7803,7 +7985,7 @@ require("./runtime");
         function initPxTransform() {}
         var taro = "taro";
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -7861,7 +8043,7 @@ require("./runtime");
         return __webpack_require__(__webpack_require__.s = moduleId);
     };
     __webpack_require__.O(0, [ 216, 592 ], (function() {
-        return __webpack_exec__(707);
+        return __webpack_exec__(442);
     }));
     var __webpack_exports__ = __webpack_require__.O();
 } ]);
@@ -8663,7 +8845,7 @@ require("./runtime");
     934: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
         var taro_runtime = __webpack_require__(184);
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -8798,34 +8980,20 @@ module.exports = {
             }
         }
     },
-    815: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+    599: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
                 return _createClass;
             }
         });
-        var esm_typeof = __webpack_require__(671);
-        function _toPrimitive(input, hint) {
-            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
-            var prim = input[Symbol.toPrimitive];
-            if (prim !== undefined) {
-                var res = prim.call(input, hint || "default");
-                if ((0, esm_typeof.Z)(res) !== "object") return res;
-                throw new TypeError("@@toPrimitive must return a primitive value.");
-            }
-            return (hint === "string" ? String : Number)(input);
-        }
-        function _toPropertyKey(arg) {
-            var key = _toPrimitive(arg, "string");
-            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
-        }
+        var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(25);
         function _defineProperties(target, props) {
             for (var i = 0; i < props.length; i++) {
                 var descriptor = props[i];
                 descriptor.enumerable = descriptor.enumerable || false;
                 descriptor.configurable = true;
                 if ("value" in descriptor) descriptor.writable = true;
-                Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
+                Object.defineProperty(target, (0, _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__.Z)(descriptor.key), descriptor);
             }
         }
         function _createClass(Constructor, protoProps, staticProps) {
@@ -8919,6 +9087,28 @@ module.exports = {
             if (superClass) _setPrototypeOf(subClass, superClass);
         }
     },
+    25: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+        __webpack_require__.d(__webpack_exports__, {
+            Z: function() {
+                return _toPropertyKey;
+            }
+        });
+        var esm_typeof = __webpack_require__(671);
+        function _toPrimitive(input, hint) {
+            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
+            var prim = input[Symbol.toPrimitive];
+            if (prim !== undefined) {
+                var res = prim.call(input, hint || "default");
+                if ((0, esm_typeof.Z)(res) !== "object") return res;
+                throw new TypeError("@@toPrimitive must return a primitive value.");
+            }
+            return (hint === "string" ? String : Number)(input);
+        }
+        function _toPropertyKey(arg) {
+            var key = _toPrimitive(arg, "string");
+            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
+        }
+    },
     671: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
diff --git a/packages/taro-webpack5-runner/src/__tests__/__snapshots__/subpackages.spec.ts.snap b/packages/taro-webpack5-runner/src/__tests__/__snapshots__/subpackages.spec.ts.snap
index 4637de5dc34..3cbbed8a859 100644
--- a/packages/taro-webpack5-runner/src/__tests__/__snapshots__/subpackages.spec.ts.snap
+++ b/packages/taro-webpack5-runner/src/__tests__/__snapshots__/subpackages.spec.ts.snap
@@ -14,7 +14,22 @@ require("./vendors");
 require("./runtime");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 143 ], {
-    699: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+    252: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+        var toPropertyKey = __webpack_require__(25);
+        function _defineProperty(obj, key, value) {
+            key = (0, toPropertyKey.Z)(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         function mergeReconciler() {}
         function mergeInternalComponents() {}
         function isArray() {}
@@ -415,7 +430,7 @@ require("./runtime");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -425,10 +440,12 @@ require("./runtime");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -497,6 +514,19 @@ require("./runtime");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, toCamelCase(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
@@ -504,7 +534,7 @@ require("./runtime");
         var taro_runtime = __webpack_require__(184);
         var taro = __webpack_require__(946);
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -566,7 +596,7 @@ require("./runtime");
         return __webpack_require__(__webpack_require__.s = moduleId);
     };
     __webpack_require__.O(0, [ 216, 592 ], (function() {
-        return __webpack_exec__(699);
+        return __webpack_exec__(252);
     }));
     var __webpack_exports__ = __webpack_require__.O();
 } ]);
@@ -1434,7 +1464,7 @@ require("../../sub-utils");
     938: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
         var taro_runtime = __webpack_require__(184);
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -1503,7 +1533,7 @@ require("../../sub-utils");
     866: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
         var taro_runtime = __webpack_require__(184);
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -1584,7 +1614,7 @@ require("../../sub-utils");
     60: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
         var taro_runtime = __webpack_require__(184);
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -1706,34 +1736,20 @@ module.exports = {
             }
         }
     },
-    815: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+    599: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
                 return _createClass;
             }
         });
-        var esm_typeof = __webpack_require__(671);
-        function _toPrimitive(input, hint) {
-            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
-            var prim = input[Symbol.toPrimitive];
-            if (prim !== undefined) {
-                var res = prim.call(input, hint || "default");
-                if ((0, esm_typeof.Z)(res) !== "object") return res;
-                throw new TypeError("@@toPrimitive must return a primitive value.");
-            }
-            return (hint === "string" ? String : Number)(input);
-        }
-        function _toPropertyKey(arg) {
-            var key = _toPrimitive(arg, "string");
-            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
-        }
+        var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(25);
         function _defineProperties(target, props) {
             for (var i = 0; i < props.length; i++) {
                 var descriptor = props[i];
                 descriptor.enumerable = descriptor.enumerable || false;
                 descriptor.configurable = true;
                 if ("value" in descriptor) descriptor.writable = true;
-                Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
+                Object.defineProperty(target, (0, _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__.Z)(descriptor.key), descriptor);
             }
         }
         function _createClass(Constructor, protoProps, staticProps) {
@@ -1827,6 +1843,28 @@ module.exports = {
             if (superClass) _setPrototypeOf(subClass, superClass);
         }
     },
+    25: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+        __webpack_require__.d(__webpack_exports__, {
+            Z: function() {
+                return _toPropertyKey;
+            }
+        });
+        var esm_typeof = __webpack_require__(671);
+        function _toPrimitive(input, hint) {
+            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
+            var prim = input[Symbol.toPrimitive];
+            if (prim !== undefined) {
+                var res = prim.call(input, hint || "default");
+                if ((0, esm_typeof.Z)(res) !== "object") return res;
+                throw new TypeError("@@toPrimitive must return a primitive value.");
+            }
+            return (hint === "string" ? String : Number)(input);
+        }
+        function _toPropertyKey(arg) {
+            var key = _toPrimitive(arg, "string");
+            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
+        }
+    },
     671: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
diff --git a/packages/taro-webpack5-runner/src/__tests__/__snapshots__/tabbar.spec.ts.snap b/packages/taro-webpack5-runner/src/__tests__/__snapshots__/tabbar.spec.ts.snap
index e32251073e8..b5180a9f5d6 100644
--- a/packages/taro-webpack5-runner/src/__tests__/__snapshots__/tabbar.spec.ts.snap
+++ b/packages/taro-webpack5-runner/src/__tests__/__snapshots__/tabbar.spec.ts.snap
@@ -14,7 +14,22 @@ require("./vendors");
 require("./runtime");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 143 ], {
-    699: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+    252: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+        var toPropertyKey = __webpack_require__(25);
+        function _defineProperty(obj, key, value) {
+            key = (0, toPropertyKey.Z)(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         function mergeReconciler() {}
         function mergeInternalComponents() {}
         function isArray() {}
@@ -412,7 +427,7 @@ require("./runtime");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -422,10 +437,12 @@ require("./runtime");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -494,6 +511,19 @@ require("./runtime");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, toCamelCase(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
@@ -501,7 +531,7 @@ require("./runtime");
         var taro_runtime = __webpack_require__(184);
         var taro = __webpack_require__(946);
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -577,7 +607,7 @@ require("./runtime");
         return __webpack_require__(__webpack_require__.s = moduleId);
     };
     __webpack_require__.O(0, [ 216, 592 ], (function() {
-        return __webpack_exec__(699);
+        return __webpack_exec__(252);
     }));
     var __webpack_exports__ = __webpack_require__.O();
 } ]);
@@ -1611,7 +1641,7 @@ h�hځ��r������Nb2��х��K~��>;;ːL�1
     111: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
         var taro_runtime = __webpack_require__(184);
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -1680,7 +1710,7 @@ h�hځ��r������Nb2��х��K~��>;;ːL�1
     142: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
         var taro_runtime = __webpack_require__(184);
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -1736,7 +1766,7 @@ h�hځ��r������Nb2��х��K~��>;;ːL�1
     60: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
         var taro_runtime = __webpack_require__(184);
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -1845,34 +1875,20 @@ module.exports = {
             }
         }
     },
-    815: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+    599: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
                 return _createClass;
             }
         });
-        var esm_typeof = __webpack_require__(671);
-        function _toPrimitive(input, hint) {
-            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
-            var prim = input[Symbol.toPrimitive];
-            if (prim !== undefined) {
-                var res = prim.call(input, hint || "default");
-                if ((0, esm_typeof.Z)(res) !== "object") return res;
-                throw new TypeError("@@toPrimitive must return a primitive value.");
-            }
-            return (hint === "string" ? String : Number)(input);
-        }
-        function _toPropertyKey(arg) {
-            var key = _toPrimitive(arg, "string");
-            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
-        }
+        var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(25);
         function _defineProperties(target, props) {
             for (var i = 0; i < props.length; i++) {
                 var descriptor = props[i];
                 descriptor.enumerable = descriptor.enumerable || false;
                 descriptor.configurable = true;
                 if ("value" in descriptor) descriptor.writable = true;
-                Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
+                Object.defineProperty(target, (0, _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__.Z)(descriptor.key), descriptor);
             }
         }
         function _createClass(Constructor, protoProps, staticProps) {
@@ -1966,6 +1982,28 @@ module.exports = {
             if (superClass) _setPrototypeOf(subClass, superClass);
         }
     },
+    25: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+        __webpack_require__.d(__webpack_exports__, {
+            Z: function() {
+                return _toPropertyKey;
+            }
+        });
+        var esm_typeof = __webpack_require__(671);
+        function _toPrimitive(input, hint) {
+            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
+            var prim = input[Symbol.toPrimitive];
+            if (prim !== undefined) {
+                var res = prim.call(input, hint || "default");
+                if ((0, esm_typeof.Z)(res) !== "object") return res;
+                throw new TypeError("@@toPrimitive must return a primitive value.");
+            }
+            return (hint === "string" ? String : Number)(input);
+        }
+        function _toPropertyKey(arg) {
+            var key = _toPrimitive(arg, "string");
+            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
+        }
+    },
     671: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
@@ -2002,7 +2040,22 @@ require("./vendors");
 require("./runtime");
 
 (my["webpackJsonp"] = my["webpackJsonp"] || []).push([ [ 143 ], {
-    162: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+    271: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+        var toPropertyKey = __webpack_require__(25);
+        function _defineProperty(obj, key, value) {
+            key = (0, toPropertyKey.Z)(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         function mergeReconciler() {}
         function mergeInternalComponents() {}
         function isArray() {}
@@ -2713,6 +2766,18 @@ require("./runtime");
             },
             RootPortal: {
                 enable: "true"
+            },
+            PageMeta: {
+                "background-color": "",
+                "background-color-top": "",
+                "background-color-bottom": "",
+                "root-background-color": "",
+                "scroll-top": "''",
+                "scroll-duration": "300",
+                "page-style": "''",
+                "root-font-size": "''",
+                "page-font-size": "''",
+                bindScroll: ""
             }
         };
         var BUBBLE_EVENTS = new Set([ "touchStart", "touchMove", "touchEnd", "touchCancel", "tap", "longTap" ]);
@@ -2736,6 +2801,19 @@ require("./runtime");
             },
             isBubbleEvents: function isBubbleEvents(eventName) {
                 return BUBBLE_EVENTS.has(eventName);
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, toCamelCase(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         var _navigator = runtime_navigator, userAgent = _navigator.userAgent;
@@ -2782,7 +2860,7 @@ require("./runtime");
         function initPxTransform() {}
         var taro = "taro";
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -2855,7 +2933,7 @@ require("./runtime");
         return __webpack_require__(__webpack_require__.s = moduleId);
     };
     __webpack_require__.O(0, [ 216, 592 ], (function() {
-        return __webpack_exec__(162);
+        return __webpack_exec__(271);
     }));
     var __webpack_exports__ = __webpack_require__.O();
 } ]);
@@ -3055,7 +3133,7 @@ h�hځ��r������Nb2��х��K~��>;;ːL�1
     303: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
         var taro_runtime = __webpack_require__(184);
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -3111,7 +3189,7 @@ h�hځ��r������Nb2��х��K~��>;;ːL�1
     60: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
         var taro_runtime = __webpack_require__(184);
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -3195,34 +3273,20 @@ export default {
             }
         }
     },
-    815: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+    599: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
                 return _createClass;
             }
         });
-        var esm_typeof = __webpack_require__(671);
-        function _toPrimitive(input, hint) {
-            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
-            var prim = input[Symbol.toPrimitive];
-            if (prim !== undefined) {
-                var res = prim.call(input, hint || "default");
-                if ((0, esm_typeof.Z)(res) !== "object") return res;
-                throw new TypeError("@@toPrimitive must return a primitive value.");
-            }
-            return (hint === "string" ? String : Number)(input);
-        }
-        function _toPropertyKey(arg) {
-            var key = _toPrimitive(arg, "string");
-            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
-        }
+        var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(25);
         function _defineProperties(target, props) {
             for (var i = 0; i < props.length; i++) {
                 var descriptor = props[i];
                 descriptor.enumerable = descriptor.enumerable || false;
                 descriptor.configurable = true;
                 if ("value" in descriptor) descriptor.writable = true;
-                Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
+                Object.defineProperty(target, (0, _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__.Z)(descriptor.key), descriptor);
             }
         }
         function _createClass(Constructor, protoProps, staticProps) {
@@ -3316,6 +3380,28 @@ export default {
             if (superClass) _setPrototypeOf(subClass, superClass);
         }
     },
+    25: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+        __webpack_require__.d(__webpack_exports__, {
+            Z: function() {
+                return _toPropertyKey;
+            }
+        });
+        var esm_typeof = __webpack_require__(671);
+        function _toPrimitive(input, hint) {
+            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
+            var prim = input[Symbol.toPrimitive];
+            if (prim !== undefined) {
+                var res = prim.call(input, hint || "default");
+                if ((0, esm_typeof.Z)(res) !== "object") return res;
+                throw new TypeError("@@toPrimitive must return a primitive value.");
+            }
+            return (hint === "string" ? String : Number)(input);
+        }
+        function _toPropertyKey(arg) {
+            var key = _toPrimitive(arg, "string");
+            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
+        }
+    },
     671: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
@@ -3349,7 +3435,22 @@ require("./vendors");
 require("./runtime");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 143 ], {
-    707: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+    442: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+        var toPropertyKey = __webpack_require__(25);
+        function _defineProperty(obj, key, value) {
+            key = (0, toPropertyKey.Z)(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         function mergeReconciler() {}
         function mergeInternalComponents() {}
         function isArray() {}
@@ -3747,7 +3848,7 @@ require("./runtime");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -3757,10 +3858,12 @@ require("./runtime");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -3829,6 +3932,19 @@ require("./runtime");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, toCamelCase(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
@@ -3867,7 +3983,7 @@ require("./runtime");
         function initPxTransform() {}
         var taro = "taro";
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -3940,7 +4056,7 @@ require("./runtime");
         return __webpack_require__(__webpack_require__.s = moduleId);
     };
     __webpack_require__.O(0, [ 216, 592 ], (function() {
-        return __webpack_exec__(707);
+        return __webpack_exec__(442);
     }));
     var __webpack_exports__ = __webpack_require__.O();
 } ]);
@@ -4798,7 +4914,7 @@ h�hځ��r������Nb2��х��K~��>;;ːL�1
     303: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
         var taro_runtime = __webpack_require__(184);
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -4854,7 +4970,7 @@ h�hځ��r������Nb2��х��K~��>;;ːL�1
     60: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
         var taro_runtime = __webpack_require__(184);
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -4963,34 +5079,20 @@ module.exports = {
             }
         }
     },
-    815: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+    599: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
                 return _createClass;
             }
         });
-        var esm_typeof = __webpack_require__(671);
-        function _toPrimitive(input, hint) {
-            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
-            var prim = input[Symbol.toPrimitive];
-            if (prim !== undefined) {
-                var res = prim.call(input, hint || "default");
-                if ((0, esm_typeof.Z)(res) !== "object") return res;
-                throw new TypeError("@@toPrimitive must return a primitive value.");
-            }
-            return (hint === "string" ? String : Number)(input);
-        }
-        function _toPropertyKey(arg) {
-            var key = _toPrimitive(arg, "string");
-            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
-        }
+        var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(25);
         function _defineProperties(target, props) {
             for (var i = 0; i < props.length; i++) {
                 var descriptor = props[i];
                 descriptor.enumerable = descriptor.enumerable || false;
                 descriptor.configurable = true;
                 if ("value" in descriptor) descriptor.writable = true;
-                Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
+                Object.defineProperty(target, (0, _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__.Z)(descriptor.key), descriptor);
             }
         }
         function _createClass(Constructor, protoProps, staticProps) {
@@ -5084,6 +5186,28 @@ module.exports = {
             if (superClass) _setPrototypeOf(subClass, superClass);
         }
     },
+    25: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+        __webpack_require__.d(__webpack_exports__, {
+            Z: function() {
+                return _toPropertyKey;
+            }
+        });
+        var esm_typeof = __webpack_require__(671);
+        function _toPrimitive(input, hint) {
+            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
+            var prim = input[Symbol.toPrimitive];
+            if (prim !== undefined) {
+                var res = prim.call(input, hint || "default");
+                if ((0, esm_typeof.Z)(res) !== "object") return res;
+                throw new TypeError("@@toPrimitive must return a primitive value.");
+            }
+            return (hint === "string" ? String : Number)(input);
+        }
+        function _toPropertyKey(arg) {
+            var key = _toPrimitive(arg, "string");
+            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
+        }
+    },
     671: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
diff --git a/packages/taro-webpack5-runner/src/__tests__/__snapshots__/ts.spec.ts.snap b/packages/taro-webpack5-runner/src/__tests__/__snapshots__/ts.spec.ts.snap
index 364e60e90c0..8dfec97213c 100644
--- a/packages/taro-webpack5-runner/src/__tests__/__snapshots__/ts.spec.ts.snap
+++ b/packages/taro-webpack5-runner/src/__tests__/__snapshots__/ts.spec.ts.snap
@@ -14,7 +14,22 @@ require("./vendors");
 require("./runtime");
 
 (wx["webpackJsonp"] = wx["webpackJsonp"] || []).push([ [ 143 ], {
-    803: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+    899: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
+        var toPropertyKey = __webpack_require__(25);
+        function _defineProperty(obj, key, value) {
+            key = (0, toPropertyKey.Z)(key);
+            if (key in obj) {
+                Object.defineProperty(obj, key, {
+                    value: value,
+                    enumerable: true,
+                    configurable: true,
+                    writable: true
+                });
+            } else {
+                obj[key] = value;
+            }
+            return obj;
+        }
         function mergeReconciler() {}
         function mergeInternalComponents() {}
         function isArray() {}
@@ -415,7 +430,7 @@ require("./runtime");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -425,10 +440,12 @@ require("./runtime");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -497,6 +514,19 @@ require("./runtime");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData: function transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    var _ref;
+                    var page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData(_defineProperty({}, toCamelCase(data.nn), data));
+                    return _ref = {
+                        sid: element.sid
+                    }, _defineProperty(_ref, "v", ""), _defineProperty(_ref, "nn", ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"), 
+                    _ref;
+                }
             }
         };
         mergeReconciler(hostConfig);
@@ -535,7 +565,7 @@ require("./runtime");
         function initPxTransform() {}
         var taro = "taro";
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -593,7 +623,7 @@ require("./runtime");
         return __webpack_require__(__webpack_require__.s = moduleId);
     };
     __webpack_require__.O(0, [ 216, 592 ], (function() {
-        return __webpack_exec__(803);
+        return __webpack_exec__(899);
     }));
     var __webpack_exports__ = __webpack_require__.O();
 } ]);
@@ -1395,7 +1425,7 @@ require("./runtime");
     611: function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) {
         var taro_runtime = __webpack_require__(184);
         var classCallCheck = __webpack_require__(113);
-        var createClass = __webpack_require__(815);
+        var createClass = __webpack_require__(599);
         var inherits = __webpack_require__(730);
         var createSuper = __webpack_require__(605);
         var react = __webpack_require__(757);
@@ -1533,34 +1563,20 @@ module.exports = {
             }
         }
     },
-    815: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+    599: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
                 return _createClass;
             }
         });
-        var esm_typeof = __webpack_require__(671);
-        function _toPrimitive(input, hint) {
-            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
-            var prim = input[Symbol.toPrimitive];
-            if (prim !== undefined) {
-                var res = prim.call(input, hint || "default");
-                if ((0, esm_typeof.Z)(res) !== "object") return res;
-                throw new TypeError("@@toPrimitive must return a primitive value.");
-            }
-            return (hint === "string" ? String : Number)(input);
-        }
-        function _toPropertyKey(arg) {
-            var key = _toPrimitive(arg, "string");
-            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
-        }
+        var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(25);
         function _defineProperties(target, props) {
             for (var i = 0; i < props.length; i++) {
                 var descriptor = props[i];
                 descriptor.enumerable = descriptor.enumerable || false;
                 descriptor.configurable = true;
                 if ("value" in descriptor) descriptor.writable = true;
-                Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
+                Object.defineProperty(target, (0, _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__.Z)(descriptor.key), descriptor);
             }
         }
         function _createClass(Constructor, protoProps, staticProps) {
@@ -1654,6 +1670,28 @@ module.exports = {
             if (superClass) _setPrototypeOf(subClass, superClass);
         }
     },
+    25: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+        __webpack_require__.d(__webpack_exports__, {
+            Z: function() {
+                return _toPropertyKey;
+            }
+        });
+        var esm_typeof = __webpack_require__(671);
+        function _toPrimitive(input, hint) {
+            if ((0, esm_typeof.Z)(input) !== "object" || input === null) return input;
+            var prim = input[Symbol.toPrimitive];
+            if (prim !== undefined) {
+                var res = prim.call(input, hint || "default");
+                if ((0, esm_typeof.Z)(res) !== "object") return res;
+                throw new TypeError("@@toPrimitive must return a primitive value.");
+            }
+            return (hint === "string" ? String : Number)(input);
+        }
+        function _toPropertyKey(arg) {
+            var key = _toPrimitive(arg, "string");
+            return (0, esm_typeof.Z)(key) === "symbol" ? key : String(key);
+        }
+    },
     671: function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: function() {
diff --git a/packages/taro-webpack5-runner/src/__tests__/__snapshots__/wx-hybrid.spec.ts.snap b/packages/taro-webpack5-runner/src/__tests__/__snapshots__/wx-hybrid.spec.ts.snap
index a0a2cc5d090..c93c8cb2b0f 100644
--- a/packages/taro-webpack5-runner/src/__tests__/__snapshots__/wx-hybrid.spec.ts.snap
+++ b/packages/taro-webpack5-runner/src/__tests__/__snapshots__/wx-hybrid.spec.ts.snap
@@ -410,7 +410,7 @@ require("./runtime");
             NavigationBar: {
                 title: _empty,
                 loading: _false,
-                "front-color": _empty,
+                "front-color": "'#000000'",
                 "background-color": _empty,
                 "color-animation-duration": _zero,
                 "color-animation-timing-func": "'linear'"
@@ -420,10 +420,12 @@ require("./runtime");
                 "background-color": _empty,
                 "background-color-top": _empty,
                 "background-color-bottom": _empty,
+                "root-background-color": _empty,
                 "scroll-top": "''",
                 "scroll-duration": "300",
                 "page-style": "''",
                 "root-font-size": "''",
+                "page-orientation": "''",
                 bindResize: _empty,
                 bindScroll: _empty,
                 bindScrollDone: _empty
@@ -492,6 +494,21 @@ require("./runtime");
                     methods.push("onSaveExitState");
                 }
                 return config;
+            },
+            transferHydrateData(data, element, componentsAlias) {
+                var _a;
+                if (element.isTransferElement) {
+                    const page = getCurrentPages()[0];
+                    data["nn"] = element.dataName;
+                    page.setData({
+                        [toCamelCase(data.nn)]: data
+                    });
+                    return {
+                        sid: element.sid,
+                        ["v"]: "",
+                        ["nn"]: ((_a = componentsAlias["#text"]) === null || _a === void 0 ? void 0 : _a._num) || "8"
+                    };
+                }
             }
         };
         mergeReconciler(hostConfig);
diff --git a/packages/taro-webpack5-runner/src/plugins/MiniPlugin.ts b/packages/taro-webpack5-runner/src/plugins/MiniPlugin.ts
index 808d8de6493..9ebfe967af1 100644
--- a/packages/taro-webpack5-runner/src/plugins/MiniPlugin.ts
+++ b/packages/taro-webpack5-runner/src/plugins/MiniPlugin.ts
@@ -270,9 +270,9 @@ export default class TaroMiniPlugin {
           })
           const isNewBlended = this.nativeComponents.has(module.name)
           const loaderName = (isNewBlended || isBuildPlugin)
-            ? '@tarojs/taro-loader/lib/native-component' 
-            : (isIndependent 
-              ? '@tarojs/taro-loader/lib/independentPage' 
+            ? '@tarojs/taro-loader/lib/native-component'
+            : (isIndependent
+              ? '@tarojs/taro-loader/lib/independentPage'
               : this.pageLoaderName)
 
           if (!isLoaderExist(module.loaders, loaderName)) {
@@ -358,7 +358,7 @@ export default class TaroMiniPlugin {
     )
 
     new TaroNormalModulesPlugin(this.options.onParseCreateElement).apply(compiler)
-    
+
     newBlended && this.addLoadChunksPlugin(compiler)
   }
 
@@ -394,13 +394,13 @@ export default class TaroMiniPlugin {
         if (fileChunks.size) {
           let source
           const id = getChunkIdOrName(chunk)
-          const { miniType } = entryModule as any 
+          const { miniType } = entryModule as any
           const entryChunk = [{ name: 'app' }]
           // 所有模块都依赖app.js，确保@tarojs\plugin-platform-xxx\dist\runtime.js先于@tarojs/runtime执行，避免Taro API未被初始化
           if (this.nativeComponents.has(id) || miniType === META_TYPE.STATIC) {
             fileChunks.forEach((v, k) => {
               if (k === id) {
-                source = addRequireToSource(id, modules, v) 
+                source = addRequireToSource(id, modules, v)
               }
             })
             return source
@@ -660,7 +660,7 @@ export default class TaroMiniPlugin {
       }
       this.pages.add(componentObj)
       // 登记需要编译成原生版本的组件
-      this.nativeComponents.set(item, componentObj) 
+      this.nativeComponents.set(item, componentObj)
     })
   }
 
@@ -780,7 +780,7 @@ export default class TaroMiniPlugin {
         }
       })
     }
-  
+
     // 递归收集依赖的第三方组件
     if (usingComponents) {
       const componentNames = Object.keys(usingComponents)
@@ -817,13 +817,13 @@ export default class TaroMiniPlugin {
         if (!componentConfig.thirdPartyComponents.has(compName) && !file.isNative) {
           componentConfig.thirdPartyComponents.set(compName, new Set())
         }
-      } 
+      }
       depComponents.forEach(item => {
         const componentPath = resolveMainFilePath(path.resolve(path.dirname(file.path), item.path))
         if (fs.existsSync(componentPath) && !Array.from(this.components).some(item => item.path === componentPath)) {
           const componentName = this.getComponentName(componentPath)
           // newBlended 模式下，本地化组件使用Page进行处理，此处直接跳过
-          if (this.nativeComponents.has(componentName)) return 
+          if (this.nativeComponents.has(componentName)) return
           const componentTempPath = this.getTemplatePath(componentPath)
           const isNative = this.isNativePageORComponent(componentTempPath)
           const componentObj = {
@@ -976,7 +976,7 @@ export default class TaroMiniPlugin {
         // 添加 comp 和 custom-wrapper 组件
         new TaroSingleEntryPlugin(compiler.context, path.resolve(__dirname, '..', 'template/comp'), `${name}/comp`, META_TYPE.STATIC).apply(childCompiler)
         new TaroSingleEntryPlugin(compiler.context, path.resolve(__dirname, '..', 'template/custom-wrapper'), `${name}/custom-wrapper`, META_TYPE.STATIC).apply(childCompiler)
-        
+
         // 给每个子编译器标记上名称和 tag
         // tag 用于生成模板和 config 时区别于主编译器走不同的方法
         // 名称用于在生成资源时判断是否为当前子编译器的资源
@@ -984,7 +984,7 @@ export default class TaroMiniPlugin {
           compilation.__name = name
           compilation.__tag = CHILD_COMPILER_TAG
         })
-        
+
         promises.push(new Promise((resolve, reject) => {
           childCompiler.runAsChild(err => {
             if (err) {
@@ -1112,6 +1112,11 @@ export default class TaroMiniPlugin {
 
       if (!isIndependent) return
 
+      // 生成页面模板需要在生成页面配置之前，因为会依赖到页面配置的部分内容
+      if (!page.isNative) {
+        this.generateTemplateFile(compilation, compiler, page.path, template.buildPageTemplate, importBaseTemplatePath, config)
+      }
+
       if (config) {
         const importBaseCompPath = promoteRelativePath(path.relative(page.path, path.join(sourceDir, independentName, this.getTargetFilePath(this.getIsBuildPluginPath(baseCompName, isBuildPlugin), ''))))
         const importCustomWrapperPath = promoteRelativePath(path.relative(page.path, path.join(sourceDir, independentName, this.getTargetFilePath(this.getIsBuildPluginPath(customWrapperName, isBuildPlugin), ''))))
@@ -1127,9 +1132,6 @@ export default class TaroMiniPlugin {
         }
         this.generateConfigFile(compilation, compiler, page.path, config.content)
       }
-      if (!page.isNative) {
-        this.generateTemplateFile(compilation, compiler, page.path, template.buildPageTemplate, importBaseTemplatePath)
-      }
     })
   }
 
@@ -1217,6 +1219,11 @@ export default class TaroMiniPlugin {
 
       if (isIndependent) return
 
+      // 生成页面模板需要在生成页面配置之前，因为会依赖到页面配置的部分内容
+      if (!page.isNative) {
+        this.generateTemplateFile(compilation, compiler, page.path, template.buildPageTemplate, importBaseTemplatePath, config)
+      }
+
       if (config) {
         const importBaseCompPath = promoteRelativePath(path.relative(page.path, path.join(sourceDir, this.getTargetFilePath(this.getIsBuildPluginPath(baseCompName, isBuildPlugin), ''))))
         const importCustomWrapperPath = promoteRelativePath(path.relative(page.path, path.join(sourceDir, this.getTargetFilePath(this.getIsBuildPluginPath(customWrapperName, isBuildPlugin), ''))))
@@ -1232,9 +1239,6 @@ export default class TaroMiniPlugin {
         }
         this.generateConfigFile(compilation, compiler, page.path, config.content)
       }
-      if (!page.isNative) {
-        this.generateTemplateFile(compilation, compiler, page.path, template.buildPageTemplate, importBaseTemplatePath)
-      }
     })
     this.generateTabBarFiles(compilation, compiler)
     this.injectCommonStyles(compilation, compiler)
@@ -1275,11 +1279,11 @@ export default class TaroMiniPlugin {
   generateConfigFile (compilation: Compilation, compiler: Compiler, filePath: string, config: Config & { component?: boolean }) {
     const { RawSource } = compiler.webpack.sources
     const fileConfigName = this.getConfigPath(this.getComponentName(filePath))
-    const unofficialConfigs = ['enableShareAppMessage', 'enableShareTimeline', 'components']
+    const unofficialConfigs = ['enableShareAppMessage', 'enableShareTimeline', 'enablePageMeta', 'components']
     unofficialConfigs.forEach(item => {
       delete config[item]
     })
-    
+
     this.adjustConfigContent(config)
 
     const fileConfigStr = JSON.stringify(config)
@@ -1406,9 +1410,9 @@ export default class TaroMiniPlugin {
     const commons = new ConcatSource('')
     const componentCommons: string[] = []
     const independentPackageNames: string[] = []
-    
+
     this.independentPackages.forEach((_, name) => { independentPackageNames.push(name) })
-    
+
     Object.keys(assets).forEach(assetName => {
       const fileName = path.basename(assetName, path.extname(assetName))
       if (
diff --git a/packages/taro/types/taro.config.d.ts b/packages/taro/types/taro.config.d.ts
index b99e974127f..fd40e8c336f 100644
--- a/packages/taro/types/taro.config.d.ts
+++ b/packages/taro/types/taro.config.d.ts
@@ -175,6 +175,12 @@ declare module './index' {
      * @default false
      */
     enableShareTimeline?: boolean
+    /**
+     * 页面是否需要使用 \<page-meta\> 和 \<navigation-bar\> 组件
+     * @default false
+     * @support weapp, alipay
+     */
+    enablePageMeta?: boolean
     /** 页面自定义组件配置
      * @see https://developers.weixin.qq.com/miniprogram/dev/framework/custom-component/
      */
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 897617682d8..7a058af5e01 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -1,9 +1,5 @@
 lockfileVersion: '6.0'
 
-settings:
-  autoInstallPeers: false
-  excludeLinksFromLockfile: false
-
 packageExtensionsChecksum: 4febf6665ca78aef4b39b91c5bd86984
 
 importers:
@@ -1347,6 +1343,8 @@ importers:
         specifier: 18.1.0
         version: registry.npmjs.org/react-test-renderer@18.1.0(react@18.1.0)
 
+  packages/taro-components/loader: {}
+
   packages/taro-extend:
     devDependencies:
       jest:
@@ -40166,3 +40164,7 @@ packages:
       property-expr: registry.npmjs.org/property-expr@2.0.5
       toposort: registry.npmjs.org/toposort@2.0.2
     dev: false
+
+settings:
+  autoInstallPeers: false
+  excludeLinksFromLockfile: false