首页 > 其他分享 >vue主应用,qiankun 子应用切换主应用样式错乱问题

vue主应用,qiankun 子应用切换主应用样式错乱问题

时间:2023-04-26 13:56:14浏览次数:34  
标签:isChildRoute vue const qiankun 应用 path

vue主应用,qiankun 子应用切换主应用样式错乱问题

 

const childRoute = ['/flinkdashboard', '/dolphinscheduler', '/datainsight' ] //子应用路径
const isChildRoute = (path) => childRoute.some(item => path.startsWith(item));
const rawAppendChild = HTMLHeadElement.prototype.appendChild;
const rawAddEventListener = window.addEventListener;

router.beforeEach((to, from, next) => {
  //如果当前路由是子项目,并且去的路由是父项目的,则还原这两个对象
  if (isChildRoute(from.path) && !isChildRoute(to.path)) {
    HTMLHeadElement.prototype.appendChild = rawAppendChild;
    window.addEventListener = rawAddEventListener;
  }
})

 

标签:isChildRoute,vue,const,qiankun,应用,path
From: https://www.cnblogs.com/wangyongping/p/17355682.html

相关文章

  • vue-cli使用方法
    是什么?vue-clivuecommandlineinterface是vue命令行接口工具怎么用?1.安装npm:【Win7】只支持node.jsv13.14.0或更早1)到官网下载https://nodejs.org/download/release/v13.14.0/node-v13.14.0-x64.msi2)注意在安装node.js时,勾选“Automaticallyinstalltheneces......
  • 山东大学数据结构实验10 堆及其应用
    内容创建最小堆类。最小堆的存储结构使用数组。提供操作:插入、删除、初始化。题目第一个操作是建堆操作,接下来是对堆的插入和删除操作,插入和删除都在建好的堆上操作。格式输入第一行一个数n(n<=5000),代表堆的大小。第二行n个数,代表堆的各个元素。第三行一个数m(m<=1000),代......
  • 若依vue框架添加kotlin依赖,实现kotlin和java混合编译
    第一步:在最外部pom.xml文件添加版本号和依赖管理properties添加版本号<kotlin.version>1.4.21</kotlin.version><!--启用kotlin增量编译--><kotlin.compiler.incremental>true</kotlin.compiler.incremental>dependencyManagement添加依赖管理<!-......
  • 实验3 控制语句与组合数据类型应用编程
    task1.py程序代码:1importrandom23print('用列表存储随机整数:')4lst=[random.randint(0,100)foriinrange(5)]5print(lst)67print('\n用集合·存储随机整数:')8s1={random.randint(0,100)foriinrange(5)}9print(s1)1011print(�......
  • vue3 uniapp Uncaught (in promise) TypeError: Cannot read properties of null (rea
    引发这个问题是在三级页面中使用uni.navigateBack({delta:2})返回到一级页面再重一级页面进入二级页面二级页面中引用的组件引发的emitsOptions报错//原因:我在二级页面中的组件使用ts的emit写法引发的报错constemit=defineEmits<{(e:'confirm',contents:string):......
  • vue3中useRouter和useRoute的使用
    vue3路由新玩法useRoute和useRouter详解原文链接原来的vue2路由是通过this.$route和this.$router来控制的。现在vue3有所变化,useRoute相当于以前的this.$route,而useRouter相当于this.$router一、useRouter手动控制路由变化import{useRouter}from'vue-router'exportdef......
  • Vue监听页面放大缩小事件
    Vue监听页面放大缩小事件 ,使用window.addEventListener,methods中方法ChangeWin(){letratio=this.getRatio();letPwidth=window.screen.width*this.getRatio()/100;letPHeight=window.screen.height*this.getRatio()/100;//1920*1080......
  • 动力节点老杜Vue框架教程【三】Vue组件化
    Vue.js是一个渐进式MVVM框架,目前被广泛使用,也成为前端中最火爆的框架Vue可以按照实际需要逐步进阶使用更多特性,也是前端的必备技能动力节点老杜的Vue2+3全家桶教程已经上线咯!学习地址:https://www.bilibili.com/video/BV17h41137i4/视频将从Vue2开始讲解,一步一个案例,知识点......
  • 动力节点老杜Vue框架教程【三】Vue组件化
    Vue.js是一个渐进式MVVM框架,目前被广泛使用,也成为前端中最火爆的框架Vue可以按照实际需要逐步进阶使用更多特性,也是前端的必备技能动力节点老杜的Vue2+3全家桶教程已经上线咯!学习地址:https://www.bilibili.com/video/BV17h41137i4/视频将从Vue2开始讲解,一步一个案例,知识点由浅入......
  • 老杜2023最新Vue实战精讲(三)Vue组件化
    动力节点老杜全新版Vue教程笔记分享给大家学习の地止:https://www.bilibili.com/video/BV17h41137i4视频教程从Vue2开始讲解,一步一个案例,知识点由浅入深,然后很自然的过度到Vue3版本。Vue3是目前企业中使用最多的一个版本。视频中会把每一个Vue的知识点讲解的非常通透,不但举例......