主要解决子应用内部跳转路由时,跳到404页的问题

  • 你能搜这个,我姑且认为你基本配置已经好了,而且子的一级路由是正常的,请往下看
  • 忘说了,我的主应用和子应用都是Vue

主应用跳子应用都正常,为什么子应用跳子路由就会404?注意这三点

  • 主应用中,你配置子应用路由的地方
  {
name: 'micro app',
entry: '//localhost:8080',
container: '#microContainer',
activeRule: '/micro-app' // 记住它,姑且叫它【张三】
}
  • 主应用的router.js(或者router.ts)
      {
path: '/micro-app/', // 跟张三一致
component: layout,
name: 'platform',
meta: {...},
children: [
{
path: ':pathMatch(.*)', // 这个表示在张三下的所有路由均有效【关键】,注意vue2和vue3配置名称不同,请自行百度
component: MicroApp, // 你需要封装一个组件,里面就放个<div id="#microContainer"></div>,用于显示子应用页面
name: 'children',
meta: {...},
}
]
}
  • 最后看看你的子应用router.js(或者router.ts)的模式中设置的路由前置
history: createWebHistory('/micro-app') //括号里一依旧是张三,注意vue2和vue3配置方法不同,请自行百度
  • 好了,再试试?

qiankun+vue,为什么我的子应用的子路由老是跳404?这么解决的更多相关文章

  1. Vue父组件向子组件传递一个动态的值,子组件如何保持实时更新实时更新?

    原文:https://blog.csdn.net/zhouweixue_vivi/article/details/78550738 2017年11月16日 14:22:50 zhouweixue_vi ...

  2. Vue父组件与子组件传递事件/调用事件

    1.Vue父组件向子组件传递事件/调用事件 <div id="app"> <hello list="list" ref="child ...

  3. vue+element ui项目总结点(四)零散细节概念巩固如vue父组件调用子组件的方法、拷贝数据、数组置空问题 等

    vue config下面的index.js配置host: '0.0.0.0',共享ip (假设你的电脑启动了这个服务我电脑一样可以启动)-------------------------------- ...

  4. vue父组件引用子组件方法显示undefined问题原因及解决方法

    关于vue父组件引用子组件问题 1.首先导入子组件并且在components中定义子组件 2.引用子组件,并定义ref,ref定义的名称用于 this.$refs所调用的名称 3.调用子组件的方法 ( ...

  5. vue 父组件与子组件的三生三世

    父组件和子组件相互传值:https://www.cnblogs.com/cxscode/p/11187989.html vue父组件触发子组件方法:https://www.cnblogs.com/cx ...

  6. vue父组件调用子组件方法、父组件向子组件传值、子组件向父组件传值

      一.父组件调用子组件方法 父组件代码  parent.vue <template> <div> <button @click="parentFun" ...

  7. vue 单文件 样式写了scoped 不能覆盖框架原有样式的解决办法

    vue 单文件 样式写了scoped 不能覆盖框架原有样式的解决办法 在vue 里面<style scoped></style> 是为了让样式只影响本身自己组件的样式,不改变全 ...

  8. vue双向数据绑定对于数组和新增对象属性不能监听的解决办法

    出现数组不能按照索引进行跟新的原因是处于性能考虑的,但是整体数组的增加删除是可以监听到的:对于对象新增属性不能监听是因为没有在生成vue实例时候放进watcher收集依赖. 首先我们先来了解vue数据 ...

  9. vue 父组件传递子组件事件

    在开发中,碰到一个需要从父组件传入方法,子组件点击触发,说白了就是,把方法传入给子组件调用 <el-col v-for='data in spreadFormat.icons' class=&q ...

随机推荐

  1. 丽泽普及2022交流赛day21 社论

    A 暴力 . greater<double> -> greater<int> \(100\) -> \(50\) 代码丢了 . B dp . 考场上代码抢救一下就过 ...

  2. php数组和对象相互转换

    function arrayToObject($e){ if( gettype($e)!='array' ) return; foreach($e as $k=>$v){ if( gettype ...

  3. 在DELL服务器上安装windows2012 r2服务器系统

    主要过程: 1.准备安装光盘,开启服务器,当出现画面按F10进入服务器自带光盘系统安装向导.(若没有系统光盘,可以用软蝶通刻一个服务系统到+R的光盘).进入后选择设置和安装系统. 2.开始安装前,提示 ...

  4. MySQL8.0错误日志Error log

    GreatSQL社区原创内容未经授权不得随意使用,转载请联系小编并注明来源. 理论知识 错误日志内容 错误日志包含mysqld启动和关闭的时间信息,还包含诊断消息,如服务器启动和关闭期间以及服务器运行 ...

  5. mui switch(开关)里面token不能及时更新

    做登录的时候再本地用locaStorage存了一个token值,但是登录之后进入页面里面发现一个switch开关里面的token值会跟着开关的切换在上一个token和当前的这个token值之间切换,我 ...

  6. 案例复现,带你分析Priority Blocking Queue比较器异常导致的NPE问题

    摘要:本文通过完整的案例复现来演示在什么情况会触发该问题,同时给出了处理建议.希望读者在编程时加以借鉴,避免再次遇到此类问题. 本文分享自华为云社区<Priority Blocking Queu ...

  7. day21--Java集合04

    Java集合04 9.Set接口方法 Set接口基本介绍 无序(添加和取出的顺序不一致),没有索引 不允许重复元素,所以最多只有一个null JDK API中接口的实现类有: Set接口的常用方法:和 ...

  8. mongo数据库-mongo角色权限

    Built-In Roles(内置角色): 1. 数据库用户角色:read.readWrite; 2. 数据库管理角色:dbAdmin.dbOwner.userAdmin: 3. 集群管理角色:clu ...

  9. java-前端之css

    css样式: <!-- 内联样式:在元素的style属性内写样式 --> <h2 style="color: red;">愿你单枪匹马,亦能所向披靡!< ...

  10. java-异步与并发之基础

    1.线程提供了一个方法: void join()该方法允许一个线程在另一个线程上等待,直到其完成工作后才解除阻塞运行.所以join可以协调线程之间同步运行线程调用join()方法,方法后就进入阻塞状态 ...