内管前端方案

单框架多页iframe

多框架微前端iframe

抽离一个独立层用作，子应用调用主应用方法或store仓库mutation

​​iframe形式组合内管应用

• 页面通信，父子通信，子父通信

  • 子父通信场景
    • 登录超时处理，子应用让父应用退出登录
  • 父子通信场景7
  • 兄弟通信，列表数据删除数据，详情操作

• 路由跳转-iframe内部跳转其他菜单，二级页面将不能通过浏览器前进后退，必须在二级页面提供返回按钮

• 状态共享-全局变量配置字典参数资源前缀、登录token等（除非完全独立，不然每次都要子应用获取数据，并且每接入一个子应用就要明确哪些全局的东西要自己处理

  • local session的内存是否可以共享，同域还是不同域
  • 必须同域

• 弹框遮罩UI风格

• iframe跨域问题，子应用需要允许跨域

• 主应用：通过路径打开页面，可以通过‘主应用.com/iframe?src="mypage" ’ ，打开

• 主应用： 支持多开相同url，不同hash的单页面，并且彼此不会影响

单页

单页的难点是多开tab，难处理

import Vue from 'vue'
import Vuex from 'vuex'
import VueRouter from 'vue-router'
import 'babel-polyfill'
import 'element-ui/lib/theme-chalk/index.css'
import ElementUI from 'element-ui'

Vue.use(ElementUI)

window.Vue = Vue
window.Vuex = Vuex
window.VueRouter = VueRouter
window.ElementUI = ElementUI