fix(plugin-qiankun): beforeRender中rootElement未正确获取子应用的rootElement

packages/fes-plugin-qiankun/examples/main/src/app.js

@@ -1,5 +1,7 @@
 import { access as accessApi } from '@fesjs/fes';
 import PageLoading from '@/components/PageLoading';
+import Antdv from 'ant-design-vue';
+import 'ant-design-vue/dist/antd.css';
 
 export const beforeRender = {
     loading: <PageLoading />,
@@ -13,3 +15,7 @@ export const beforeRender = {
         });
     }
 };
+
+export const onAppCreated = ({ app }) => {
+    app.use(Antdv);
+};

packages/fes-plugin-qiankun/examples/main/src/pages/index.vue

@@ -1,8 +1,12 @@
 <template>
     <div>
         main
+        <a-tabs v-model:activeKey="activeKey">
+            <a-tab-pane key="1" tab="Tab 1"> <MicroAppWithMemoHistory key="1" name="app1" url="/app1" /></a-tab-pane>
+            <a-tab-pane key="2" tab="Tab 2"><MicroAppWithMemoHistory key="2" name="app1" url="/app1/test" /></a-tab-pane>
+            <a-tab-pane key="3" tab="Tab 3">Content of Tab Pane 3</a-tab-pane>
+        </a-tabs>
     </div>
-    <MicroAppWithMemoHistory name="app1" :url="url" />
 </template>
 <config>
 {
@@ -24,6 +28,7 @@ export default {
             }, 3000);
         });
         return {
+            activeKey: ref('1'),
             url
         };
     }

packages/fes-plugin-qiankun/src/micro/index.js

@@ -165,7 +165,7 @@ export default function (api) {
 
     api.addEntryCode(
         () => `
-export const bootstrap = qiankun_genBootstrap(completeClientRender, app);
+export const bootstrap = qiankun_genBootstrap(clientRender, app);
 export const mount = qiankun_genMount('#${api.config.mountElementId}');
 export const unmount = qiankun_genUnmount();
 export const update = qiankun_genUpdate();

packages/fes-preset-built-in/src/plugins/generateFiles/fes/fes.tpl

@@ -40,29 +40,7 @@ const renderClient = (opts = {}) => {
     return app;
 }
 
-const getClientRender = (args = {}) => plugin.applyPlugins({
+const beforeRender = async ({rootElement}) => {
-  key: 'render',
-  type: ApplyPluginsType.compose,
-  initialValue: () => {
-    const opts = plugin.applyPlugins({
-      key: 'modifyClientRenderOpts',
-      type: ApplyPluginsType.modify,
-      initialValue: {
-        initialState: args.initialState,
-        routes: args.routes || getRoutes(),
-        plugin,
-        rootElement: '{{{ rootElement }}}',
-{{#enableTitle}}
-        defaultTitle: `{{{ defaultTitle }}}`,
-{{/enableTitle}}
-      },
-    });
-    return renderClient(opts);
-  },
-  args,
-});
-
-const beforeRender = async () => {
     const beforeRenderConfig = plugin.applyPlugins({
         key: "beforeRender",
         type: ApplyPluginsType.modify,
@@ -74,7 +52,7 @@ const beforeRender = async () => {
     let initialState = {};
     if (typeof beforeRenderConfig.action === "function") {
         const app = createApp(beforeRenderConfig.loading);
-        app.mount('{{{ rootElement }}}');
+        app.mount(rootElement);
         try {
             initialState = await beforeRenderConfig.action();
         } catch(e){
@@ -86,14 +64,31 @@ const beforeRender = async () => {
     return initialState;
 };
 
-const completeClientRender = async () => {
+const getClientRender = (args = {}) => plugin.applyPlugins({
-    const initialState = await beforeRender();
+  key: 'render',
-    const clientRender = getClientRender({initialState});
+  type: ApplyPluginsType.compose,
-    const app = clientRender();
+  initialValue: async () => {
-    return app;
+    const opts = plugin.applyPlugins({
-};
+      key: 'modifyClientRenderOpts',
+      type: ApplyPluginsType.modify,
+      initialValue: {
+        routes: args.routes || getRoutes(),
+        plugin,
+        rootElement: '{{{ rootElement }}}',
+{{#enableTitle}}
+        defaultTitle: `{{{ defaultTitle }}}`,
+{{/enableTitle}}
+      },
+    });
+    const initialState = await beforeRender(opts); 
+    return renderClient({...opts, initialState});
+  },
+  args,
+});
 
-const app = completeClientRender();
+const clientRender = getClientRender();
+
+const app = clientRender();
 
 {{{ entryCode }}}