vue3+elementplus+ruoyi 页面跳转后返回看空白页，需要手动刷新才能显示页面问题记录

最近开发ruoyi的项目，发现一个奇怪的问题：切换路由，页面出现空白，点击刷新后出现页面内容。尝试了多种方案终于解决了，在这里记录一下，希望能帮助到同样入此坑的前端开发者们。页面内容必须囊括在1个根结点下。

今天在用若依框架vue3版本开发的时候遇到个bug：切换菜单，跳转到其他页面会导致所有页面出现空白的情况，刷新页面后又恢复正常（只限于当前页面正常）

前端使用若依框架(vue3版本)，在开发过程中有时会出现切换菜单或者tab，页面空白的情况，刷新页面后又恢复正常。解决方案1：删除页面中template下的注释 ，一般这种情况是template包含多个根元素。，你放其他位置或把注释去掉即可。不然的话子组件就算有2个根元素，所以会导致页面空白。解决方案3：在AppMain中的keep-alive外包裹上div(推荐)解决方案2：删除AppMain中的transition解决。

vue3路由切换后需要刷新一下页面才能显示内容

找到 router-view 之后 ，加上 :key="$route.fullPath"

vue3中所有页面需要手动刷新一下才能显示，控制台没有报错。登录进来是进入首页，然后切换任何页面都是空白，但是控制台没有报错。在其他页面刷新后却能显示，然而切换到首页刷新后再切换到其他页面又是空白。

若依是使用的前端技术Vue、Element后端SpringBoot & Security完全分离的权限管理系统。里面有开源代码及开发文档，开发后台管理项目可以去学习一下

vue3页面跳转产生白屏，刷新后能正常展示的解决方案

在使用若依框架时，创建好了对应的菜单，路由，分配权限以后。点击菜单却显示空白页面，此时路由url显示已经跳转过去，但是页面空白，同时没有请求任何的接口。

在做毕设的时候，在权限路由得到时候，我问通过router**.**addRoute(item)的方式，在路由守卫动态添加路由刚开始没什么问题，页面的都能正常显示，网络请求也能发送，后来出现了刷新页面，跳转到404解决方法提取出404代码片段追加到处理好的权限列表的末尾我项目采用的vue-router是4.3.3版本。

ruoyi前后端分离项目部分页签点击后会刷新页面，但是一部分页签点击后不会刷新页面

作为一个后端程序员，前端知识还是很水，最近基于若依做个人小项目出现菜单切换出现空白页情况，浪费我很长时间，在这里总结下，希望小友遇到类似问题可以快速解决。解决办法如下图：原理咱也不懂，为啥一个div就能解决。

前端项目若依版本号是 RuoYi-Vue-Plus v5.1.0，在开发过程中有时会出现切换菜单或者tab，页面空白的情况，刷新页面后又恢复正常了。多次复现出现这种情况一般是在页面停留了几分钟再操作，偶尔也会莫名奇妙的出现，具体什么原因还不明确。在网上找了些资料，看到部分开发者也遇到过这个问题，应该是框架本身的bug，可能是由于在AppMain中用了transition，组件内又使用了transition导致的。删除后就没有再遇到跳转空白的情况了，虽然没有路由过渡动画了，但是保证系统正常使用才是最重要的。

在/layout/components/AppMain.vue找到AppMain.vue文件,添加以下代码即可。今天在做公司新项目时遇到一个问题,在使用若依vue3版本时遇到了添加动态路由页面有时候不显示的问题,在这里添加后,刷新页面也没有显示。最终发现是因为需要给router-view加一个key标志。

这个白屏问题我是第一次遇到，所以想完整记录一下，本文也借鉴了一下别人的。