<!--动态组件-->
<!--缓存,只缓存about和home组件-->
<keep-alive exclude="about" >
<component
:is="currentTab"
v-bind="msg">
</component>
</keep-alive>

这里的v-bind:is绑定的就是子组件的名称

keep-alive标签可以让子组件再切换时能够缓存,不被销毁

keep-alive标签的exclude和include属性可以指定哪个子组件生效或者不生效

exclude和include属性的正则表达式形式和数组形式需要用v-bind来区分

 

vue3-动态组件的要点的更多相关文章

  1. VUE3 之 动态组件 - 这个系列的教程通俗易懂,适合新手

    1. 概述 暗示效应告诉我们: 巧妙的暗示会在不知不觉中剥夺我们的判断力,对我们的思维形成一定的影响,造成我们行为的些许改变或者偏差. 例如你的朋友说你脸色不太好,是不是病了,此时,你可能就会感觉浑身 ...

  2. 06-Flutter移动电商实战-dio基础_Get_Post请求和动态组件协作

    上篇文章中,我们只看到了 dio 的使用方式,但并未跟应用关联起来,所以这一篇将 dio 网络请求与应用界面结合起来,当然这也是为以后的实战作基础准备,基础打牢,我们才能飞速前进. 1.案例说明 我们 ...

  3. Flutter移动电商实战 --(6)dio基础_Get_Post请求和动态组件协作

    上篇文章中,我们只看到了 dio 的使用方式,但并未跟应用关联起来,所以这一篇将 dio 网络请求与应用界面结合起来,当然这也是为以后的实战作基础准备,基础打牢,我们才能飞速前进. 1.案例说明 我们 ...

  4. vuejs动态组件给子组件传递数据

    vuejs动态组件给子组件传递数据 通过子组件定义时候的props可以支持父组件给子组件传递数据,这些定义的props在子组件的标签中使用绑定属性即可,但是如果使用的是<component> ...

  5. C++ 类的动态组件化技术

    序言: N年前,我们曾在软件开发上出现了这样的困惑,用VC开发COM组件过于复杂,用VB开发COM组件发现效率低,而且不能实现面向对象的很多特性,例如,继承,多态等.更况且如何快速封装利用历史遗留的大 ...

  6. Hibernate学习---第五节:普通组件和动态组件

    一.普通组件映射配置 1.创建组件类,代码如下: package learn.hibernate.bean; /** * 组件类 */ public class Phones { private St ...

  7. vue2入坑随记(二) -- 自定义动态组件

    学习了Vue全家桶和一些UI基本够用了,但是用元素的方式使用组件还是不够灵活,比如我们需要通过js代码直接调用组件,而不是每次在页面上通过属性去控制组件的表现.下面讲一下如何定义动态组件. Vue.e ...

  8. Vue动态组件

    前面的话 让多个组件使用同一个挂载点,并动态切换,这就是动态组件.本文将详细介绍Vue动态组件 概述 通过使用保留的 <component> 元素,动态地绑定到它的 is 特性,可以实现动 ...

  9. angular2 学习笔记 ( Dynamic Component 动态组件)

    更新 2018-02-07 详细讲一下 TemplateRef 和 ViewContainerRef 的插入 refer : https://segmentfault.com/a/1190000008 ...

  10. Vue两种组件类型介绍:递归组件和动态组件

    一递归组件 递归组件的特性就是可以在自己的template模板中调用自己本身.值得注意的它必须设置name属性. // 递归组件 recursive.vue <template> < ...

随机推荐

  1. 如何清除项目git版本控制信息

    首先进入项目目录下 邮件打开 git bash here 执行命令 find . -name ".git" | xargs rm -rf 就清除了git版本控制信息

  2. Docker consul的容器服务更新与发现

    Docker consul的容器服务更新与发现 目录 Docker consul的容器服务更新与发现 一.Consul简介 1. 服务注册与发现 2. consul概述 3. consul的两种模式 ...

  3. Solution -「CF 1380F」Strange Addition

    \(\mathcal{Description}\)   Link.   定义两个数在进行加法时,进位单独作为一位.例如: .   给定一个 \(n\) 为数和 \(m\) 次修改操作,每次修改会修改 ...

  4. ASP.NET Core 6框架揭秘实例演示[05]:依赖注入基本编程模式

    毫不夸张地说,整个ASP.NET Core就是建立在依赖注入框架之上的.ASP.NET Core应用在启动时构建管道所需的服务,以及管道处理请求使用到的服务,均来源于依赖注入容器.依赖注入容器不仅为A ...

  5. Netty高级应用及聊天室实战

    Netty 高级应用 1. 编解码器 概念:在网络应用中,需要实现某种编解码器.将原始字节数据与自定义消息数据进行相互转换.网络中都是以字节码的形式传输的. 对Netty而言,编解码器由两部分组成:编 ...

  6. 书写高质量sql的一些建议

    It's better to light a candle than to curse the darkness 老生常谈的不要使用select * 如果硬要使用select *,那么就请忍受一下以下 ...

  7. 天啦,从Mongo到ClickHouse我到底经历了什么?

    前言: 在实现前端监控系统的最初,使用了 Mongo 作为日志数据存储库.文档型存储,在日志字段扩展和收缩上都能非常方便.天生的 JSON 格式和 NodeJs 配合也非常贴合.就这样度过了几个月的蜜 ...

  8. Python中编码encode()与解码decode()

    1 print('这是编码'.encode('utf-8')) # 结果 b'\xe8\xbf\x99\xe6\x98\xaf\xe7\xbc\x96\xe7\xa0\x81' 2 print('这是 ...

  9. 2022必须拥有Chrome扩展程序 - 浏览器插件,让你上网效率翻倍

    在Chrome网上应用店中查找扩展程序 2022必须拥有Chrome扩展程序 - 浏览器插件,让你上网效率翻倍 可扩展的Chrome Web浏览器比某些人认识的功能强大得多.您可以自定义浏览体验,使其 ...

  10. BI工具的选择标准有哪些?

    作为企业的IT部门如果没有良好的BI工具支持,IT部门将会十分容易陷入困境.那么面对多元化的BI工具市场,IT部门如何选择BI工具呢?BI工具选择的标准又是什么?Smartbi将为大家做一个简单的解答 ...