vue3 RouterLink路由跳转后RouterView组件未加载,页面未显示,且控制台无任何报错

news2025/1/11 12:55:44

在使用 vue3 开发项目过程中,组件之间使用 router-link 跳转,但是当我开发的组件跳转到其他组件时,其他组件的页面未加载,再跳转回自己的组件时,自己的组件也加载不出来了,浏览器刷新后页面可以加载出来。但是初始页面如果是其他组件,进行路由跳转就没有这个问题。

当我打开控制台查看页面时,发现页面未加载是因为 RouterView 组件未加载,如下图:
在这里插入图片描述
代码为:

*在这里插入图片描述*

在排除了路由逻辑以及没有其他任何页面报错的情况下,我蒙了。经多方搜索,然后终于让我找到了解决方法。
搜索得到的解决办法URL
原来是我的 index.vue 页面下的根元素有两个,而 transition 组件包裹下的组件中只能有一个根元素

在这里插入图片描述
于是修改代码:
在这里插入图片描述
注意:即便是被注释的代码,template 下也只能有一个根元素。

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2063477.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

点亮希望之灯:解决孩子自闭症的探索之路

在这个充满活力与挑战的世界里,有一群特殊的孩子,他们仿佛生活在自己的孤独星球上,难以与外界进行有效的沟通和互动。他们是自闭症儿童,也被称为 “星星的孩子”。面对这些孩子的自闭症问题,我们该如何寻找解决之道呢&…

C语言06--数组进阶

数组名含义 数组名有两个含义: 第一含义是:整个数组第二含义是:首元素的地址当出现以下情形时,那么数组名就代表整个数组: 在数组定义中在 sizeof 运算表达式中 ,因此sizeof 计算的就是整个数组的大小。si…

《黑神话:悟空》风灵月影V1.0-35项修改器全面解析

《黑神话:悟空》作为一款备受瞩目的魂系动作角色扮演游戏,以其细腻的画面、流畅的操作和深厚的剧情吸引了众多玩家的关注。然而,对于不少玩家来说,游戏的高难度设置也带来了不小的挑战。为此,风灵月影工作室特别推出了…

[Spring] Spring原理(SpringBoot完结)

🌸个人主页:https://blog.csdn.net/2301_80050796?spm1000.2115.3001.5343 🏵️热门专栏: 🧊 Java基本语法(97平均质量分)https://blog.csdn.net/2301_80050796/category_12615970.html?spm1001.2014.3001.5482 🍕 Collection与…

【15】Java字节码

Java方法栈帧的组成:操作数栈局部变量表 操作数栈 Java字节码是Java虚拟机所使用的的指令集。它与JVM基于栈的计算模型是分不开的。 在解释执行过程中,每当为 Java 方法分配栈桢时,Java 虚拟机往往需要开辟一块额外的空间作为操作数栈&…

JavaEE 第16节 线程安全的集合类

目录 前言 顺序表 队列 哈希表 1、Hashtable 2、ConcurrentHashMap(重点) 前言 本文章主要介绍在多线程环境下,如何线程安全的使用一些常用的集合类(顺序表和哈希表)。 顺序表 1、自己使用同步锁机制&#xff…

模拟笔试:卡码网2023年快手笔试真题

1.158同余方程 思路 纯数学的思路&#xff0c;想不出来的话很难做。 欧几里得算法视频讲解 代码 #include <iostream> using namespace std;// 扩展欧几里得&#xff1a;计算 ax by gcd(a, b) 的解 long long extended_gcd(long long a, long long b, long long &a…

Java语言程序设计——篇十五(5)

&#x1f33f;&#x1f33f;&#x1f33f;跟随博主脚步&#xff0c;从这里开始→博主主页&#x1f33f;&#x1f33f;&#x1f33f; 欢迎大家&#xff1a;这里是我的学习笔记、总结知识的地方&#xff0c;喜欢的话请三连&#xff0c;有问题可以私信&#x1f333;&#x1f333;&…

【STM32嵌入式系统设计与开发拓展】——16_FreeRTOS操作系统

参考&#xff1a;链接: 正点原子 一、认识裸机和RTOS 裸机是无操作系统支持&#xff0c;程序直接运行在硬件上&#xff0c;开发者要自行处理硬件细节。早期单片机常采用&#xff0c;优点是性能和资源利用率高&#xff0c;缺点是开发难、可移植性差。RTOS 是实时操作系统&…

vscode导入的包裹代码名称没有颜色

问题描述:代码其他染色正常,但是例如import torchtorch没有颜色,虽然能够识别(ctrl左键能够点进去看到torch代码) 解决: 下载extention pylancefile->preferences->settings, 搜索Python: Language Server, 从default改成pylance

JAVA—IO流

存储数据的方案File和文件数据的操作IO流&#xff0c;学习字节流和字符流&#xff0c;了解框架和IO框架Commons IO 目录 1.File &#xff08;1&#xff09;创建对象 &#xff08;2&#xff09;常用方法 【1】判断类型&#xff0c;获取信息 【2】创建文件&#xff0c;删除…

LNMP学习

一、LNMP—web 1. 概述 LNMP/LAMP linux/windows/unix apache/nginx mysql/pgsql php/jsp 2. nginx部署及其平滑升级 实操 3. nginx七层负载均衡及算法 算法参考文档&#xff1a;https://docs.nginx.com/nginx/admin-guide/load-balancer/http-load-balancer/ 实操 4…

flv格式转换mp4怎么转换?5个软件帮助你自己快速进行格式转换

flv格式转换mp4怎么转换&#xff1f;5个软件让你从此快速转换格式不求别人 将FLV格式的视频转换为MP4格式可以通过使用以下五款软件来轻松实现。这些工具操作简便&#xff0c;能够快速高效地完成视频格式的转换&#xff0c;让你轻松应对各种视频格式需求。 口袋视频转换器 这…

网安新声 | 网易云音乐崩了:网络安全如何守护在线体验

网安加社区【网安新声】栏目&#xff0c;汇聚网络安全领域的权威专家与资深学者&#xff0c;紧跟当下热点安全事件、剖析前沿技术动态及政策导向&#xff0c;以专业视野和前瞻洞察&#xff0c;引领行业共同探讨并应对新挑战的策略与可行路径。 8月19日&#xff0c;#网易云音乐崩…

“休闲化“趋势增强,IAA手游出海如何抓住增长机遇?

进入存量时代&#xff0c;全球手游市场正面临严峻的挑战。数据显示&#xff0c;2023年 App Store 和 Google Play 的全球双端下载量同比下降10%&#xff0c;IAP 收入也同比减少2%。而作为大盘的支柱品类&#xff0c;中重度手游首当其冲。以 RPG 和 SLG 品类为例&#xff0c;虽然…

Halo个人博客Docker部署结合内网穿透为本地站点配置公网地址远程访问

文章目录 前言1. Docker部署Halo1.1 检查Docker版本如果未安装Docker可参考已安装Docker步骤&#xff1a;1.2 在Docker中部署Halo 2. Linux安装Cpolar2.1 打开服务器防火墙2.2 安装cpolar内网穿透 3. 配置Halo个人博客公网地址4. 固定Halo公网地址 前言 本文主要介绍如何在Cen…

常见计算机网络协议汇总(非常详细)从零基础入门到精通,看完这一篇就够了

文章目录 前言计算机网络五层模型回顾应用层协议 DNS协议&#xff1a;HTTP协议HTTPS协议 传输层协议 UDP协议TCP 网络层 IP协议ICMP协议 数据链路层 ARP协议 物理层整体的网络传输流程 1️⃣网络安全零基础入门 ① 学习路线② 路线对应学习视频 2️⃣视频配套资料&国内外网…

二分+前缀和+思维,CF 1902D - Robot Queries

目录 一、题目 1、题目描述 2、输入输出 2.1输入 2.2输出 3、原题链接 二、解题报告 1、思路分析 2、复杂度 3、代码详解 一、题目 1、题目描述 2、输入输出 2.1输入 2.2输出 3、原题链接 1902D - Robot Queries 二、解题报告 1、思路分析 不管怎么反转: 起点终…

【新品实测】C1001毫米波人体检测传感器来了!跌倒检测、睡眠监测更准确!

我们最近推出了一款全新的60G毫米波产品&#xff1a;C1001毫米波人体检测传感器。在这篇文章中&#xff0c;我们将深入测评这款产品的性能&#xff0c;并详细解析C1001毫米波人体检测传感器的功能和特性。 产品链接&#xff1a;C1001 60GHz毫米波人体检测传感器 原文链接&…

QML ScrollView 实现自动滚动到底部

先看效果,每当有新的日志,会自动添加到Text中,主要实现了ScrollView自动滑动到底部,显示最新的日志 目录 1.思路2.position分析 1.思路 在官网中scrollview并没有关于scrollview位置的设置 但是我们可以控制右边滑动条scrollbar的位置 注意position并不是一个高度数据,你可以…