RuoYi-vue3.0点击菜单或tab出现空白页面 无报错或点击新添加的动态路由出现其他tab空白，需要重新刷新下页面才能显示出页面

已于 2025-04-27 17:54:39 修改
阅读量631 收藏 2
点赞数 5
CC 4.0 BY-SA版权
文章标签： ruoyi vue3.0
于 2025-04-27 17:00:35 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/m_7_m/article/details/147564041

前端使用若依框架(vue3版本)，在开发过程中有时会出现切换菜单或者tab，页面空白的情况，刷新页面后又恢复正常

解决方案1：删除页面中template下的注释 ，一般这种情况是template包含多个根元素导致
注意一级节点也包含注释 ，可以放其他位置或把注释去掉即可。

解决方案2：删除AppMain中的transition解决

解决方案3：在AppMain中的keep-alive外包裹上div(推荐)

m_7_m
关注
解决：RuoYi点击菜单出现空白页面，无报错
zh94264的博客
01-24 4269
前端使用若依框架(vue3版本)，在开发过程中有时会出现切换菜单或者tab，页面空白的情况，刷新页面后又恢复正常。出现这种情况一般是在页面停留了几分钟再操作或者短时间多次跳转，偶尔也会莫名奇妙的出现，但就因为同时使用了transition和keep-alive，并在组件内又使用了transition导致的(原理还不了解，可能是缓存了动画的原因，知道的大佬可以解答下)网上看到部分开发者也遇到过这个问题，应该是框架本身的bug，找寻之后发现在。目前本人只了解到以上两种解决方案。
ruoyi-admin和ruoyi-vue3笔记-gl-wms物流管理项目
TY121810的博客
07-24 1225
gl-wms物流管理项目。
ruoyi+vue-router动态路由刷新后页面消失的解决办法
weixin_65465925的博客
07-25 1294
解决vue+ruoyi动态路由页面刷新页面空白问题，亲测有用
Vue3 若依二开项目—出现url跳转，但是页面显示空白的情况，重新刷新才能显示页面
huhuhu667的博客
06-11 189
在我用若依进行二开的时候，发生了一个这样的问题，在页面跳转时出现url跳转，但是页面显示空白的情况，这时必须重新刷新才能显示页面。直接在AppMain.vue中将transition标签去除，同样可以起到相同作用。在AppMain.vue中在transition标签的内容下再用一个div进行包裹。
Vue3使用keepLive实现切换页面，但出现空页面现象
m0_59538127的博客
03-07 380
在加了个key属性，然后在script里面加了这几个事件，就可以了。第二种就是router-view就作为根标签，在外面加个div包住就可以。但是这两种情况我都不满足，还是出现空页面现象。
记录：Ruoyi在菜单管理中配置菜单出现空白页面，控制台无报错
weixin_53196143的博客
09-26 647
网上查阅了资料，有些开发者也会遇到这个问题，我猜应该是他框架本身的问题。解决办法也是参考网上的。反复查看配置的菜单所需的条件是没有问题的，所以就想到是不是组件中有问题，查找到显示页面的。如果各位小伙伴有更好的解决办法，还请推荐！有知道具体原因的还请多多指教！我是用的第一种办法。加上以后就没有跳转空白的问题了，暂时算解决了。加跳转动画，keep-alilve缓存，具体什么原因还不明确。2、注释掉AppMain中的transition。外包裹了一层 div ，并加上key。记录一下此问题，耗费了我好长时间。
若依框架路由跳转成功却显示空白页面问题
m0_59792807的博客
04-01 801
在使用若依框架时，创建好了对应的菜单，路由，分配权限以后。点击菜单却显示空白页面，此时路由url显示已经跳转过去，但是页面空白，同时没有请求任何的接口。
vue3+elementplus+ruoyi 页面跳转后返回看空白页，需要手动刷新才能显示页面问题记录
qianduanVIP666的博客
01-22 251
问题描述：页面A跳转到页面B,跳转后，路由地址已更换，但是页面没有加载，需要手动刷新后页面才会显示出来。解决方案：跳转的目标页面没有根目录，需要把所有的元素包裹在一个根目录内，问题就可以解决了。
若依前端，菜单栏切换时刷新问题 [页面菜单切换时，页面总是重新刷新，导致页面输入的查询参数重载清空]
qq_40603125的博客
05-17 3178
组件中name、id和菜单中路径保持一致即可，不要写list。
【踩坑】Vue3项目正常跑动后页面空白问题
Vivien_CC的博客
09-07 1749
近期踩了个坑，Vue3搭建的项目能够正常跑动，但是页面却是空白的，控制台也不报错，只留下一行警告：发现是 router 入口文件（一般是在 router 文件夹下的 index 里面）的写法和 vite 版本不匹配的问题。随着 Vite 版本的更新，一些 API 可能会发生变化或被弃用，这会导致在升级 Vite 或项目迁移时遇到兼容性问题。我遇到的问题正是因为 Vite 的版本更新导致了 import.meta.globEager 的使用方式变化。
解决vue-router 切换tab标签关闭时缓存问题
01-19
在router入口页面加上 keepAlive: true // 需要被缓存 false则不需要 { path: 'fundProListG', component: resolve => require(['@/pages/product/fundPros/fundTab/fundTab.vue'], resolve), title: '基金首页...
解决vue多个路由共用一个页面的问题
08-27
在 Vue 开发中，遇到多个路由需要共用一个页面的需求是非常普遍的，特别是当路由是通过动态添加的，不同的路由展示的东西只是数据不同其他没有变化。这篇文章将与您分享解决 Vue 多个路由共用一个页面的问题，具有很...
ruoyi-vue的tab打开时，怎么查看缓存
09-10
在Ruoyi-Vue项目中，如果你想在Tab打开时检查是否有缓存数据，你可以按照以下步骤操作： 1. 首先，你需要在项目中引入相关的缓存管理库，例如`vue-router-cache-middleware`或`axios-cache-adapter`等，它们可以...
vue3中所有页面需要手动刷新一下才能显示，控制台没有报错
kanno的博客
04-23 1269
vue3中所有页面需要手动刷新一下才能显示，控制台没有报错。登录进来是进入首页，然后切换任何页面都是空白，但是控制台没有报错。在其他页面刷新后却能显示，然而切换到首页刷新后再切换到其他页面又是空白。
【Vue3+若依框架】切换路由出现白屏
最新发布
Owen的博客
06-26 120
在做项目过程中出现了，切换页面，出现了内容区域白屏，不是整个页面白屏。开始我一直以为是路由权限配置或者路由配置的问题，后来才发现是。，在vue3语法中 tempalte 多个根节点也不会报错。
【Ruoyi】若依默认打开第一个子菜单，三级菜单时默认跳转到第一个子菜单
ew45218的博客
12-27 1818
官方给出的答案是处理2级菜单的，当菜单为三级时就会出现问题，打开404。在ruoyi-vue中，默认打开第一个子菜单问题处理。
前端接入若依后，页面白屏问题排查
lj940628的博客
12-14 1476
开发过程中的问题排查
若依v3.2问题解决：菜单路由不匹配 / 跳转路由页面空白
喜大普奔
07-06 4335
结果测试发现是router-view下的＜transition/＞标签添加“out-in“,导航到其他画面为空白。菜单路由不匹配 ，在菜单管理中匹配代码中的相应组件，可是在页面上总是报匹配错误，下面是报错情况和相关数据库。因为店铺管理是一个目录，而店铺详情和店铺列表是菜单，路由规则中目录要有一个菜单匹配，也就是path也相同。若依用router跳转路由时，页面白屏，，虽然比之前少了点效果，但bug解决了。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值