vue3某一个路由切换,导致所有路由页面均变成空白页

index1.vue

html 复制代码
<template>
	<div>展示区域1</div>
	<div>展示区域2</div>
</template>

index2.vue

html 复制代码
<template>
	<div>展示区域1</div>
</template>

当index1切换到别的路由时,会变成空白页,再切换所有页面都是空白页 ,只有刷新 后,才能恢复正常;

而通过index切换路由时,是正常的

可能是Vue 3.5.13 中使用两个 div 作为根节点导致页面空白的可能原因

哪怕是写一个div,加个<!--注释-->注释也不行

版本:

js 复制代码
"dependencies": {
		"@axolo/json-editor-vue": "^0.3.2",
		"@chenfengyuan/vue-qrcode": "^2.0.0",
		"@element-plus/icons-vue": "^2.0.10",
		"@form-create/element-ui": "3.2.16",
		"@fullcalendar/adaptive": "^6.1.19",
		"@fullcalendar/core": "^6.1.19",
		"@fullcalendar/daygrid": "^6.1.19",
		"@fullcalendar/interaction": "^6.1.19",
		"@fullcalendar/vue3": "^6.1.19",
		"@microsoft/fetch-event-source": "^2.0.1",
		"@popperjs/core": "2.11.8",
		"@vueuse/core": "^10.4.1",
		"@wangeditor-next/editor": "5.6.34",
		"@wangeditor-next/editor-for-vue": "5.1.14",
		"autoprefixer": "^10.4.7",
		"axios": "^1.3.3",
		"codemirror": "5.65.5",
		"cropperjs": "^1.5.12",
		"crypto-js": "^3.1.9-1",
		"disable-devtool": "^0.3.8",
		"driver.js": "^0.9.8",
		"echarts": "^5.4.1",
		"element-plus": "2.5.5",
		"exif-js": "^2.3.0",
		"form-create-designer": "3.2.11-oem",
		"highlight.js": "^11.7.0",
		"image-conversion": "^2.1.1",
		"js-base64": "^3.7.7",
		"js-cookie": "^3.0.1",
		"json-editor-vue3": "^1.1.1",
		"lodash": "^4.17.21",
		"marked": "^12.0.2",
		"markmap-common": "0.15.6",
		"markmap-lib": "0.15.8",
		"markmap-view": "0.15.8",
		"mitt": "^3.0.0",
		"moment": "^2.30.1",
		"nprogress": "^0.2.0",
		"pinia": "2.0.32",
		"postcss": "8.4.40",
		"print-js": "^1.6.0",
		"qrcode": "1.5.1",
		"qs": "^6.11.0",
		"screenfull": "^6.0.2",
		"sm-crypto": "^0.3.12",
		"sortablejs": "^1.15.0",
		"splitpanes": "^3.1.5",
		"tailwindcss": "3.4.17",
		"v-calendar": "3.1.2",
		"vue": "3.5.13",
		"vue-clipboard3": "^2.0.0",
		"vue-echarts": "7.0.3",
		"vue-i18n": "9.2.2",
		"vue-router": "^4.1.6",
		"vue3-tree-org": "^4.2.2",
		"vue3-video-play": "1.3.1-beta.6",
		"vuedraggable": "^4.1.0",
		"xlsx": "^0.18.5"
	},
	"devDependencies": {
		"@swc/core": "1.6.13",
		"@types/crypto-js": "^4.2.2",
		"@types/markdown-it": "^14.1.1",
		"@types/node": "^18.14.0",
		"@types/nprogress": "^0.2.0",
		"@types/sm-crypto": "^0.3.4",
		"@types/sortablejs": "^1.15.0",
		"@typescript-eslint/eslint-plugin": "^5.53.0",
		"@typescript-eslint/parser": "^5.53.0",
		"@vitejs/plugin-vue": "^4.0.0",
		"@vue/compiler-sfc": "^3.2.47",
		"consola": "^2.15.3",
		"cross-env": "7.0.3",
		"daisyui": "4.11.1",
		"eslint": "^8.34.0",
		"eslint-plugin-vue": "^9.9.0",
		"pinia-plugin-persist": "^1.0.0",
		"prettier": "2.8.4",
		"sass": "1.58.3",
		"terser": "^5.31.1",
		"typescript": "^4.9.5",
		"unplugin-auto-import": "^0.13.0",
		"vite": "^4.3.3",
		"vite-plugin-compression": "^0.5.1",
		"vite-plugin-style-import": "^2.0.0",
		"vite-plugin-top-level-await": "^1.3.0",
		"vite-plugin-vue-setup-extend": "^0.4.0",
		"vue-eslint-parser": "^9.1.0"
	},
相关推荐
AI袋鼠帝7 小时前
火爆全网的Seedance2.0 十万人排队,我2分钟就用上了
前端
IT_陈寒7 小时前
React Hooks闭包陷阱:你以为的state可能早就过期了
前端·人工智能·后端
Jenlybein7 小时前
快速了解熟悉 Vite ,即刻上手使用
前端·javascript·vite
小码哥_常7 小时前
安卓开发避坑指南:全局异常捕获与优雅处理实战
前端
lihaozecq7 小时前
我用 1 天的时间 vibe coding 了一个多人德州扑克游戏
前端·react.js·ai编程
momo061177 小时前
AI Skill是什么?
前端·ai编程
言萧凡_CookieBoty7 小时前
用 AI 搞定用户系统:Superpowers 工程化开发教程
前端·ai编程
小小小小宇7 小时前
Go 语言协程
前端
牛奶7 小时前
5MB vs 4KB vs 无限大:浏览器存储谁更强?
前端·浏览器·indexeddb
牛奶7 小时前
setTimeout设为0就马上执行?JS异步背后的秘密
前端·性能优化·promise