主要解决子应用内部跳转路由时,跳到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. 【Azure Developer】在Azure VM (Windows) 中搭建 kafka服务,并且通过本地以及远程验证 发送+消费 消息

    问题描述 查看了 "How to Install and Run Apache Kafka on Windows? " 一文后,成功安装了Kafka服务,但是如何使用呢?如何在其他 ...

  2. 心动不如行动,基于Docker安装关系型数据库PostgrelSQL替代Mysql

    原文转载自「刘悦的技术博客」https://v3u.cn/a_id_171 最近"全栈数据库"的概念甚嚣尘上,主角就是PostgrelSQL,它最近这几年的技术发展不可谓不猛,覆盖 ...

  3. Modbus转Profinet网关案例 | 三菱FR-A700系列变频器配置方法

    本案例是利用小疆智控Modbus转Profinet网关GW-PN5001把三菱FR-A700变频器接入到西门子1200PLC.实现Profinet转Modbus的通讯协议的互转. 用到设备有:三菱FR ...

  4. 万答#3,MGR最佳配置参考,PFS里的监测指标要全开吗,mysqld进程占用内存过高怎么排查

    GreatSQL社区原创内容未经授权不得随意使用,转载请联系小编并注明来源. 问题1,有推荐的MGR运行最佳配置参考吗 在「3306π」社区广州站5月22日的分享会上,万里数据库CTO娄帅给出了他建议 ...

  5. Docker Compose之容器编排开发初探

    1.前言 Docker Compose 是 Docker 官方编排(Orchestration)项目之一,负责快速在集群中部署分布式应用. Compose 是一个用于定义和运行多个 Docker 应用 ...

  6. Java学习--方法

    Java学习 方法 方法 定义 Java方法是语句的集合,一起执行一个功能. 方法是解决一类问题的步骤的有序组合. 方法包含在类或对象中. 方法在程序中被创建,在其他地方被引用. 设计方法的时候,最好 ...

  7. 总结-DSU ON TREE(树上启发式合并)

    考试遇到一道题: 有一棵n个点的有根树,每个点有一个颜色,每次询问给定一个点\(u\)和一个数\(k\),询问\(u\)子是多少个不同颜色节点的\(k\)级祖先.n<=500000. 显然对每一 ...

  8. java学习第二天多态.day09

    接口 接口总结 接口表示一种规约(规范.标准),它里面定义了一些列抽象方法(功能),它可以被多个类实现. 1接口名称首写字母用I,表示一个接口,后命名使用驼峰命名 2.接口中定义的都是抽象方法,所以可 ...

  9. 开源云真机平台-Sonic应用实践

    前言 Sonic是一款开源.支持分布式部署.在线自动化测试的私有云真机平台.偶然接触到这个平台是源于虫师的一篇公众号文章<基于Linux 部署 Sonic>,于是结合文章内容和官网尝试搭建 ...

  10. SpringMvc 如何同时支持 Jsp 和 Json 接口?

    后端同学基本都会见过这种场景:在同一个工程中,有些页面使用jsp模版渲染,同时还有其他接口提供Json格式的返回值.为了同时支持这两种场景,我们一般是如何处理的呢? 其实非常简单: 1.在项目中为 S ...