window[`micro-app-${window.__MICRO_APP_NAME__}`] = { mount, unmount } else mount() 3-6、安装路由 cd app_first //1.先进入子应用1目录下 npm install vue-router@3//2.安装路由 3-7、修改App.vue文件 子应用1Home | 子应用1About | Secon...
micro-app提供了一套灵活的数据通信机制,方便主应用和子应用之间的数据传输。你可以通过<micro-app>组件的data属性向子应用发送数据,也可以在子应用中通过window.microApp.getData()获取数据,并通过window.microApp.dispatch()向主应用发送数据。 例如,在主应用中发送数据到子应用: vue <template> &...
第一步:创建一个vite+vue3的父工程项目 npm init vite-app micro-app-vite-vue3.0 第二步:安装micro-app的依赖 npm i @micro-zoe/micro-app --save 第四步:main.js中引入插件,并开启 importmicroAppfrom'@micro-zoe/micro-app'microApp.start() 第五步:父工程配置路由(非严格匹配写法:pathMatch(.*))...
setup() { const state = reactive({ microApp_ifs: null, microApp_pis: null, microApp_tms: null, data: [], ifs: 0, pis: 0 }); const route = useRouter(); watch(() => route.currentRoute.value.path, (count, prevCount) => { if (count.indexOf('/ifs/eam') != -1) { state...
Open opened this issueJan 18, 2022· 1 comment senrocommentedJan 18, 2022• edited Collaborator gongshuncommentedJan 18, 2022 vue-router 有 abstract 模式,但是不能用MicroAppWithMemoHistory标签,需要用手动加载的方式 👍1cuijiudai reacted with thumbs up emoji ...
micro-app版本:"@micro-zoe/micro-app": "^1.0.0-rc.16", 主应用前端框架&版本:vue2, "ant-design-vue": "^1.7.8", 子应用前端框架&版本:vue3, "ant-design-vue": "^4.2.3", "vite": "^4.4.9", 构建工具&版本:node16.16.1 Sign up for free to join this conversation on GitHub. Alread...
本资源是在基于micro-app在vue-element-admin中的搭建之后对micro-app在vue-element-admin中的使用进行的进一步研究。 主要包括:路由、页面之间的跳转、数据通信、样式隔离、元素隔离、资源共享、组件共享等的一些研究。 注: (1)代码下载后要分别要对基座和子应用安装依赖npm install ...
mkdir single-spa-app cd single-spa-app 接下来,我们将初始化一个新的package.json文件: npm init -y 现在,这是有趣的部分。我们将安装此项目所需的所有依赖项。我将把它们分成不同的步骤。 1. 安装常规依赖项 npm install react react-dom single-spa single-spa-react single-spa-vue v ...
setup() { const state = reactive({ microApp_ifs: null, microApp_pis: null, microApp_tms: null, data: [], ifs: 0, pis: 0 }); const route = useRouter(); watch(() => route.currentRoute.value.path, (count, prevCount) => { if (count.indexOf('/ifs/eam') != -1) { state...
// 导入qiankun内置函数 import { registerMicroApps, // 注册子应用 runAfterFirstMounted, // 第一个子应用装载完毕 setDefaultMountApp, // 设置默认装载子应用 start, // 启动 } from 'qiankun'; let app = null; /** * 渲染函数 * appContent 子应用html * loading 如果主应用设置loading效果,可不...