Vue3动态加载组件,警告:Vue received a Component than was made a reactive object

news2025/4/1 9:39:25

场景

2个按钮,点击之后,下面加载不同的组件。

现象

在这里插入图片描述

分析

实际动态加载的组件,不是深层响应式的,推荐使用 shallowReactive 或 shallowRef,即浅层作用形式,仅最外层是响应式,以此来提升性能。

上代码

动态渲染组件的时候需要用defineAsyncComponent

const currentCom = shallowRef();

const componentList = {
	comA: defineAsyncComponent(()=> import('@/page/comA.vue')),
	comB: defineAsyncComponent(()=> import('@/page/comB.vue'))
}
<Component :is="currentCom ">

完美解决!

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

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

相关文章

【源码阅读/Vue Flask前后端】简历数据查询功能

目录 一、Flask后端部分modelServiceroute 二、Vue前端部分index.js main.vue功能界面templatescriptstyle 一般就是三个层面&#xff0c;model层面用来建立数据库的字段&#xff0c;service用来对model进行操作&#xff0c;写一些数据库操作的代码&#xff0c;route就是具体的…

Vue背景介绍+声明式渲染+数据响应式

一、Vue背景 1. 为什么学Vue 1.前后端开发就业必备技能 2.岗位多&#xff0c;绝⼤互联⽹公司都在使⽤Vue&#xff0c;还可以助⼒SpringBoot、C等项⽬开发 3.提⾼开发效率 更少的时间,干更多的活,提高项目开发速度 原生JS做法 Vue做法 总而言之: 使用Vue能够赋能、提升就业竞争…

HarmonyOS NEXT 鸿蒙中手写和使用第三方仓库封装Logger打印工具

应用场景 在鸿蒙开发中&#xff0c;我们在很多时候调试代码都需要用到日志打印工具&#xff0c;但无论是hilog还是console.log,都用起来相对麻烦&#xff0c;而且需要手动将对象转换为JSON字符串的方式才能打印&#xff0c;并且在控制台日志中输出的格式也非常丑。所以下面我们…

批量合并 PDF 文档,支持合并成单个文档,也支持按文件夹合并 PDF 文档

在日常工作中&#xff0c;合并多个 PDF 文档为一个文件是非常常见的需求。通过合并 PDF&#xff0c;不仅能够更方便地进行管理&#xff0c;还能在特定场景下&#xff08;如批量打印&#xff09;提高效率。那么&#xff0c;当我们需要批量合并多个 PDF 文件时&#xff0c;是否有…

rbpf虚拟机-汇编和反汇编器

文章目录 一、概述二、主要功能三、关键函数解析3.1 汇编器3.1.1 parse -转换为Instruction列表3.1.2 assemble_internal-转换为Insn 3.2 反汇编器3.2.1 to_insn_vec-转换为机器指令 四、总结 Welcome to Code Blocks blog 本篇文章主要介绍了 [rbpf虚拟机-汇编和反汇编器] ❤…

虚拟现实--->unity学习

前言&#xff1a;这学期劳动课选了虚拟现实&#xff0c;其中老师算挺认真的&#xff0c;当然对一些不感兴趣的同学来说是一种折磨&#xff0c;我对这个unity的学习以及后续的虚幻引擎刚开始连基础的概念都没有&#xff0c;后面渐渐也是滋生了一些兴趣&#xff0c;用这篇博客记录…

一文详解QT环境搭建:ubuntu20.4安装配置Qt5

随着软件开发技术的不断进步&#xff0c;跨平台应用程序的需求日益增长&#xff0c;开发者们面临着如何在不同操作系统之间保持代码的一致性和效率的问题。Qt作为一个成熟的跨平台C框架&#xff0c;在这方面提供了卓越的支持&#xff0c;不仅简化了GUI应用程序的创建过程&#…

【IDEA的个性化配置】

目录&#xff1a; 一&#xff1a;隐藏项目路径二&#xff1a;禁用斜体注释三&#xff1a;重新Maven构建未完待续... 一&#xff1a;隐藏项目路径 &#x1f60a;在IDEA左侧的Project目录中&#xff0c;项目名称后面显示了项目的文件路径地址&#xff0c;如果不喜欢可以隐藏&…

【Kafka】分布式消息队列的核心奥秘

文章目录 一、Kafka 的基石概念​主题&#xff08;Topic&#xff09;​分区&#xff08;Partition&#xff09;​生产者&#xff08;Producer&#xff09;​消费者&#xff08;Consumer&#xff09;​ 二、Kafka 的架构探秘​Broker 集群​副本机制​ 三、Kafka 的卓越特性​高…

自动化发布工具CI/CD实践Jenkins部署与配置教程

1. 前言背景 其实一直想把jenkins 的笔记整理下&#xff0c;介于公司这次升级jenkins2.0 &#xff0c;根据自己部署的一些经验&#xff0c;我把它整理成笔记。 之前我们的jenkins1.0 时代 还一直停留在 free style 或者 maven 风格的项目&#xff0c;随着项目的日益增多&#x…

什么是SQL作业

SQL作业是在数据库服务器上按特定时间或间隔自动执行的计划任务或流程&#xff0c;这些作业由Microsoft SQL Server中的SQL Server代理管理&#xff0c;对于自动执行日常任务&#xff08;如数据库系统中的备份、数据导入和报告生成&#xff09;以及确保及时准确地处理和更新数据…

Android实践开发制作小猴子摘桃小游戏

Android实践制作小猴子摘桃小游戏 实践素材项目源文件获取&#xff1a;Android可能存在版本差异项目如果不能正确运行&#xff0c;可以使用里面的素材自己构建项目Android实践制作小猴子摘桃小游戏Android实践制作小猴子摘桃小游戏https://mp.weixin.qq.com/s/jNU_hVfj9xklsil…

springboot整合couchbase(集群)

springboot整合couchbase 1、Couchbase1.1、介绍1.2、Bucket1.3、Couchbase SDK 2、(key,value)写入couchbase集群2.1、总体图2.2、依赖2.3、CouchbaseConfig 配置文件2.4、代码使用 1、Couchbase 1.1、介绍 1.2、Bucket 在 Couchbase 中&#xff0c;bucket 是一个重要的概念…

VsCode启用右括号自动跳过(自动重写) - 自录制gif演示

VsCode启用右括号自动跳过(自动重写) - 自录制gif演示 前言 不知道大家在编程时候的按键习惯是怎样的。输入完左括号后编辑器一般会自动补全右括号&#xff0c;输入完左括号的内容后&#xff0c;是按→跳过右括号还是按)跳过右括号呢&#xff1f; for (int i 0; i < a.s…

[Linux]在vim中批量注释与批量取消注释

1.在vim中批量注释的步骤&#xff1a; 1.在normal模式下按Ctrl v &#xff0c;进入V-BLOCK模式 2.按 J 键 或 K 键选择要注释的内容&#xff0c;J向上K向下 我们给第5&#xff0c;6&#xff0c;7行进行注释 3.按住shift i进入插入模式&#xff0c;输入 // 4.点击ESC键&…

NC,GFS、ICON 数据气象信息可视化--降雨量的实现

随着气象数据的快速发展和应用&#xff0c;气象信息的可视化成为了一项不可或缺的技术手段。它不仅能帮助气象专家快速解读数据&#xff0c;还能为公众提供直观的天气预报信息。今天&#xff0c;我们将从降雨量的可视化出发&#xff0c;带大家一起了解如何实现气象数据的可视化…

LLM之RAG实战(五十二)| 如何使用混合搜索优化RAG 检索

在RAG项目中&#xff0c;大模型生成的参考内容&#xff08;专业术语称为块&#xff09;来自前一步的检索&#xff0c;检索的内容在很大程度上直接决定了生成的效果&#xff0c;因此检索对于RAG项目至关重要&#xff0c;最常用的检索方法是关键字搜索和语义搜索。本文将分别介绍…

[操作系统,学习记录]3.进程(2)

1.fork(); 玩法一&#xff1a;通过返回值if&#xff0c;else去执行不同的代码片段 玩法二&#xff1a;if&#xff0c;else然后调用execve函数去执行新的程序 2.进程终止&#xff1a; 退出码&#xff0c;子进程通过exit/return返回&#xff0c;父进程wait/waitpid等待而得&am…

26考研——排序_选择排序_选择排序的基本思想 简单选择排序(8)

408答疑 文章目录 四、选择排序选择排序的基本思想简单选择排序定义算法思想性能分析空间效率时间效率稳定性 适用性 九、参考资料鲍鱼科技课件26王道考研书 四、选择排序 选择排序的基本思想 每一趟&#xff08;如第 i i i 趟&#xff09;在剩下 n − i 1 n-i1 n−i1&…

PPT——组合SCI论文图片

SCI论文中对于图的排版常常是最头疼的事情&#xff0c;通常需要几个图组合在一起&#xff0c;并且如何控制图中的字体一致也是麻烦事。 保持这个大图里面的一致&#xff0c;转头一看跟其他图又不一致了。最近跟我的博导学了一手&#xff0c;今天就来记录一下吧。主要用到的软件…