@alicloud/alfa-react 1.5.1-alpha.3 → 1.5.1-alpha.5

package/es/createApplication.js

@@ -78,7 +78,8 @@ export default function createApplication(loader) {
       dynamicConfig = props.dynamicConfig,
       noCache = props.noCache,
       syncHistory = props.syncHistory,
-      basename = props.basename;
+      basename = props.basename,
+      onSyncHistory = props.onSyncHistory;
     var handleExternalLink = customProps.handleExternalLink;
     var _useState = useState(null),
       _useState2 = _slicedToArray(_useState, 2),
@@ -97,9 +98,11 @@ export default function createApplication(loader) {
       setReleaseVersion = _useState6[1];
     $syncHistory.current = syncHistory;
     $basename.current = basename;
-    if (customProps.__innerStamp) console.warn('Please do not use __innerStamp which used in internal.');
+
+    // if (customProps.__innerStamp) console.warn('Please do not use __innerStamp which used in internal.');
     // 更新标记，保证每次更新都会更新
     customProps.__innerStamp = (+new Date()).toString(36);
+    customProps.__historyState = history.state;
     if (customProps.path) customProps.path = addLeftSlash(customProps.path);
 
     // 受控模式锁定一些参数
@@ -174,6 +177,12 @@ export default function createApplication(loader) {
         popstateEvent.state = history.state;
         (_App = App) === null || _App === void 0 ? void 0 : (_App$context$baseFram = _App.context.baseFrame) === null || _App$context$baseFram === void 0 ? void 0 : (_App$context$baseFram2 = _App$context$baseFram.contentWindow) === null || _App$context$baseFram2 === void 0 ? void 0 : _App$context$baseFram2.dispatchEvent(popstateEvent);
       };
+
+      /**
+       * 因为要兼容历史逻辑，所以这段逻辑并不会执行
+       * react-router 的路由监听 callback 会先执行并更新子应用内部路由
+       * @returns
+       */
       var updateAppHistory = function updateAppHistory() {
         if (App) {
           var nextPath = peelPath(App.context.location);
@@ -192,7 +201,6 @@ export default function createApplication(loader) {
       };
 
       // 受控模式下，返回不会触发子应用内的路由更新，需要主动通知
-      // 这段逻辑不一定生效，因为我们已经劫持了沙箱内的 history.go 方法
       if ($syncHistory.current) window.addEventListener('popstate', updateAppHistory);
       _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
         var _app$context$updateBo, _app$context, _app$context$baseFram;
@@ -255,6 +263,7 @@ export default function createApplication(loader) {
                       var nextPath = addBasename((_url === null || _url === void 0 ? void 0 : _url.toString()) || '', $basename.current);
                       if ("".concat(nextPath) !== peelPath(window.location)) {
                         window.history.pushState(data, unused, nextPath);
+                        onSyncHistory && onSyncHistory('push', nextPath, data);
                       }
                       originalReplaceState(data, unused, _url);
                     } else {
@@ -265,6 +274,7 @@ export default function createApplication(loader) {
                     var nextPath = addBasename((_url === null || _url === void 0 ? void 0 : _url.toString()) || '', $basename.current);
                     if ($syncHistory.current) {
                       window.history.replaceState(data, unused, nextPath);
+                      onSyncHistory && onSyncHistory('replace', nextPath, data);
                     }
                     originalReplaceState(data, unused, _url);
                   };
@@ -272,8 +282,6 @@ export default function createApplication(loader) {
                   // 劫持微应用的返回
                   frameWindow.history.go = function (n) {
                     window.history.go(n);
-                    // 同步更新子应用的 state
-                    originalReplaceState(history.state, '', peelPath(frameWindow.location));
                   };
                 }
               }

package/es/version.js

@@ -1 +1 @@
-export var version = '1.5.1-alpha.3';
+export var version = '1.5.1-alpha.5';

package/lib/createApplication.js

@@ -88,7 +88,8 @@ function createApplication(loader) {
       dynamicConfig = props.dynamicConfig,
       noCache = props.noCache,
       syncHistory = props.syncHistory,
-      basename = props.basename;
+      basename = props.basename,
+      onSyncHistory = props.onSyncHistory;
     var handleExternalLink = customProps.handleExternalLink;
     var _useState = (0, _react.useState)(null),
       _useState2 = (0, _slicedToArray2.default)(_useState, 2),
@@ -107,9 +108,11 @@ function createApplication(loader) {
       setReleaseVersion = _useState6[1];
     $syncHistory.current = syncHistory;
     $basename.current = basename;
-    if (customProps.__innerStamp) console.warn('Please do not use __innerStamp which used in internal.');
+
+    // if (customProps.__innerStamp) console.warn('Please do not use __innerStamp which used in internal.');
     // 更新标记，保证每次更新都会更新
     customProps.__innerStamp = (+new Date()).toString(36);
+    customProps.__historyState = history.state;
     if (customProps.path) customProps.path = addLeftSlash(customProps.path);
 
     // 受控模式锁定一些参数
@@ -184,6 +187,12 @@ function createApplication(loader) {
         popstateEvent.state = history.state;
         (_App = App) === null || _App === void 0 ? void 0 : (_App$context$baseFram = _App.context.baseFrame) === null || _App$context$baseFram === void 0 ? void 0 : (_App$context$baseFram2 = _App$context$baseFram.contentWindow) === null || _App$context$baseFram2 === void 0 ? void 0 : _App$context$baseFram2.dispatchEvent(popstateEvent);
       };
+
+      /**
+       * 因为要兼容历史逻辑，所以这段逻辑并不会执行
+       * react-router 的路由监听 callback 会先执行并更新子应用内部路由
+       * @returns
+       */
       var updateAppHistory = function updateAppHistory() {
         if (App) {
           var nextPath = peelPath(App.context.location);
@@ -202,7 +211,6 @@ function createApplication(loader) {
       };
 
       // 受控模式下，返回不会触发子应用内的路由更新，需要主动通知
-      // 这段逻辑不一定生效，因为我们已经劫持了沙箱内的 history.go 方法
       if ($syncHistory.current) window.addEventListener('popstate', updateAppHistory);
       (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
         var _app$context$updateBo, _app$context, _app$context$baseFram;
@@ -265,6 +273,7 @@ function createApplication(loader) {
                       var nextPath = addBasename((_url === null || _url === void 0 ? void 0 : _url.toString()) || '', $basename.current);
                       if ("".concat(nextPath) !== peelPath(window.location)) {
                         window.history.pushState(data, unused, nextPath);
+                        onSyncHistory && onSyncHistory('push', nextPath, data);
                       }
                       originalReplaceState(data, unused, _url);
                     } else {
@@ -275,6 +284,7 @@ function createApplication(loader) {
                     var nextPath = addBasename((_url === null || _url === void 0 ? void 0 : _url.toString()) || '', $basename.current);
                     if ($syncHistory.current) {
                       window.history.replaceState(data, unused, nextPath);
+                      onSyncHistory && onSyncHistory('replace', nextPath, data);
                     }
                     originalReplaceState(data, unused, _url);
                   };
@@ -282,8 +292,6 @@ function createApplication(loader) {
                   // 劫持微应用的返回
                   frameWindow.history.go = function (n) {
                     window.history.go(n);
-                    // 同步更新子应用的 state
-                    originalReplaceState(history.state, '', peelPath(frameWindow.location));
                   };
                 }
               }

package/lib/version.js

@@ -4,5 +4,5 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.version = void 0;
-var version = '1.5.1-alpha.3';
+var version = '1.5.1-alpha.5';
 exports.version = version;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alicloud/alfa-react",
-  "version": "1.5.1-alpha.3",
+  "version": "1.5.1-alpha.5",
   "description": "Alfa Framework (React Version)",
   "main": "lib/index.js",
   "module": "es/index.js",

package/types/createAlfaApp.d.ts

@@ -15,6 +15,10 @@ interface IProps {
      * 是否开启路由自动同步，需配合 basename 使用
      */
     syncHistory?: boolean;
+    /**
+     * 同步子应用路由的回调函数
+     */
+    onSyncHistory?: (type: 'replace' | 'push', pathname: string, state: any) => void;
     /**
      * 子应用路由前缀
      */

package/types/createApplication.d.ts

@@ -7,9 +7,11 @@ interface IProps<C = any> extends AlfaFactoryOption {
         path?: string;
         __injectHistory?: any;
         __innerStamp?: string;
+        __historyState?: string;
         handleExternalLink?: (href: string) => void;
     };
     syncHistory?: boolean;
+    onSyncHistory?: (type: 'replace' | 'push', path: string, data: any) => void;
     basename?: string;
 }
 /**

package/types/version.d.ts

@@ -1 +1 @@
-export declare const version = "1.5.1-alpha.3";
+export declare const version = "1.5.1-alpha.5";