diff --git a/packages/fes-plugin-qiankun/examples/app1/src/pages/app1/index.vue b/packages/fes-plugin-qiankun/examples/app1/src/pages/app1/index.vue index ef9b2005..5dbfb5b9 100644 --- a/packages/fes-plugin-qiankun/examples/app1/src/pages/app1/index.vue +++ b/packages/fes-plugin-qiankun/examples/app1/src/pages/app1/index.vue @@ -1,6 +1,7 @@ diff --git a/packages/fes-plugin-qiankun/examples/app1/src/pages/app1/test.vue b/packages/fes-plugin-qiankun/examples/app1/src/pages/app1/test.vue index f20e10fd..746abb88 100644 --- a/packages/fes-plugin-qiankun/examples/app1/src/pages/app1/test.vue +++ b/packages/fes-plugin-qiankun/examples/app1/src/pages/app1/test.vue @@ -1,6 +1,7 @@ diff --git a/packages/fes-plugin-qiankun/src/main/runtime/MicroApp.tpl b/packages/fes-plugin-qiankun/src/main/runtime/MicroApp.tpl index 1140bdbe..35a89d7e 100644 --- a/packages/fes-plugin-qiankun/src/main/runtime/MicroApp.tpl +++ b/packages/fes-plugin-qiankun/src/main/runtime/MicroApp.tpl @@ -12,13 +12,13 @@ import {mergeWith} from "{{{LODASH_ES}}}"; // eslint-disable-next-line import/extensions import { getMasterOptions } from "./masterOptions"; -function unmountMicroApp(microApp) { +async function unmountMicroApp(microApp) { if (!microApp) { return; } const status = microApp.getStatus(); if (status === 'MOUNTED') { - microApp.unmount(); + await microApp.unmount(); } } @@ -80,7 +80,7 @@ export const MicroApp = defineComponent({ microAppRef.value = loadMicroApp( { // 保证唯一 - name: `${name}_${Date.now()}`, + name: `${name}`, entry: entry, container: containerRef.value, props: {...propsConfigRef.value} diff --git a/packages/fes-plugin-qiankun/src/micro/runtime/lifecycles.tpl b/packages/fes-plugin-qiankun/src/micro/runtime/lifecycles.tpl index c98aed7a..48469482 100644 --- a/packages/fes-plugin-qiankun/src/micro/runtime/lifecycles.tpl +++ b/packages/fes-plugin-qiankun/src/micro/runtime/lifecycles.tpl @@ -1,4 +1,4 @@ -import { plugin, ApplyPluginsType, getRouter, getHistory, destroyRouter } from '@@/core/coreExports'; +import { plugin, ApplyPluginsType } from '@@/core/coreExports'; {{#HAS_PLUGIN_MODEL}} import { setModelState } from './qiankunModel'; {{/HAS_PLUGIN_MODEL}} @@ -18,6 +18,7 @@ function isPromise(obj) { let render = () => {}; let cacheAppPromise = null; let hasMountedAtLeastOnce = false; +const cache = {}; export default () => defer.promise; @@ -91,6 +92,11 @@ export function genMount(mountElementId) { defer.resolve(); } hasMountedAtLeastOnce = true; + cacheAppPromise.then((app)=>{ + if(!cache[props.name]) { + cache[props.name] = app; + } + }) }; } @@ -109,9 +115,15 @@ export function genUpdate() { // 子应用生命周期钩子Unmount export function genUnmount() { return async (props) => { - const history = getHistory(); - history.destroy(); // 会触发app.unmount - destroyRouter(); + if (cache[props.name]) { + setTimeout(() => { + const app = cache[props.name]; + app.unmount(); + app._container.innerHTML = ''; + delete cache[props.name]; + cacheAppPromise = null; + }, 0); + } const slaveRuntime = getSlaveRuntime(); if (slaveRuntime.unmount) { await slaveRuntime.unmount(props); diff --git a/packages/fes-plugin-qiankun/src/micro/runtime/runtime.tpl b/packages/fes-plugin-qiankun/src/micro/runtime/runtime.tpl index 63a0bcd1..2d620c2c 100644 --- a/packages/fes-plugin-qiankun/src/micro/runtime/runtime.tpl +++ b/packages/fes-plugin-qiankun/src/micro/runtime/runtime.tpl @@ -1,5 +1,5 @@ -import { createMemoryHistory, getHistory } from '@@/core/coreExports'; -import qiankunRender, { clientRenderOptsStack, history } from './lifecycles'; +import { createMemoryHistory } from '@@/core/coreExports'; +import qiankunRender, { clientRenderOptsStack, history as historyConfig } from './lifecycles'; export const render = oldRender => qiankunRender().then(oldRender); @@ -15,19 +15,18 @@ export function modifyClientRenderOpts(memo) { } export function modifyCreateHistory(memo) { - if (history.url) { + if (historyConfig.url) { return createMemoryHistory } return memo; } -export function onRouterCreated({ router }) { - if(history.url) { - const memoryHistory = getHistory(); - memoryHistory.push(history.url) +export function onRouterCreated({ router, history }) { + if(historyConfig.url) { + history.push(historyConfig.url) } - if(history.onRouterInit){ - history.onRouterInit(router) + if(historyConfig.onRouterInit){ + historyConfig.onRouterInit(router) } } diff --git a/packages/fes-preset-built-in/src/plugins/generateFiles/fes/fes.tpl b/packages/fes-preset-built-in/src/plugins/generateFiles/fes/fes.tpl index 295a50a9..b66d1b85 100644 --- a/packages/fes-preset-built-in/src/plugins/generateFiles/fes/fes.tpl +++ b/packages/fes-preset-built-in/src/plugins/generateFiles/fes/fes.tpl @@ -61,6 +61,7 @@ const beforeRender = async ({rootElement}) => { console.error(e); } app.unmount(); + app._container.innerHTML = ''; } return initialState; }; diff --git a/packages/fes-preset-built-in/src/plugins/misc/route/index.js b/packages/fes-preset-built-in/src/plugins/misc/route/index.js index f963cb00..386e417a 100644 --- a/packages/fes-preset-built-in/src/plugins/misc/route/index.js +++ b/packages/fes-preset-built-in/src/plugins/misc/route/index.js @@ -328,7 +328,7 @@ export default function (api) { api.addCoreExports(() => [ { - specifiers: ['getRoutes', 'getRouter', 'getHistory', 'destroyRouter', 'defineRouteMeta'], + specifiers: ['getRoutes', 'defineRouteMeta'], source: absCoreFilePath } ]); diff --git a/packages/fes-preset-built-in/src/plugins/misc/route/template/routes.tpl b/packages/fes-preset-built-in/src/plugins/misc/route/template/routes.tpl index 0a7e3cba..3ce78e67 100644 --- a/packages/fes-preset-built-in/src/plugins/misc/route/template/routes.tpl +++ b/packages/fes-preset-built-in/src/plugins/misc/route/template/routes.tpl @@ -7,12 +7,8 @@ export function getRoutes() { } const ROUTER_BASE = '{{{ routerBase }}}'; -let router = null; -let history = null; + export const createRouter = (routes) => { - if (router) { - return router; - } const createHistory = plugin.applyPlugins({ key: 'modifyCreateHistory', type: ApplyPluginsType.modify, @@ -21,14 +17,14 @@ export const createRouter = (routes) => { }, initialValue: {{{ CREATE_HISTORY }}}, }); - history = createHistory(ROUTER_BASE); + const history = createHistory(ROUTER_BASE); // 修改routes plugin.applyPlugins({ key: 'patchRoutes', type: ApplyPluginsType.event, args: { routes }, }); - router = createVueRouter({ + const router = createVueRouter({ history, routes }); @@ -36,31 +32,12 @@ export const createRouter = (routes) => { plugin.applyPlugins({ key: 'onRouterCreated', type: ApplyPluginsType.event, - args: { router }, + args: { router, history }, }); return router; }; -export const getRouter = ()=>{ - if(!router){ - console.warn(`[preset-build-in] router is null`) - } - return router; -} - -export const getHistory = ()=>{ - if(!history){ - console.warn(`[preset-build-in] history is null`) - } - return history; -} - -export const destroyRouter = ()=>{ - router = null; - history = null; -} - export const defineRouteMeta = (param)=>{ return param }