站长家园(原代码之家)(www.adminjie.com)网站源码,微信源码,游戏源码,商业源码分享平台。
当前位置:网站首页 技术文章 网络编程 正文

什么是动态组件?深入了解Vue中的动态组件

时间:2022-05-31 [网络编程]作者:fabuyuan 浏览:6 次

什么是动态组件?本篇文章带大家详细了解一下Vue入门必备知识中的动态组件,介绍一下如何实现动态组件渲染、keep-alive组件,希望对大家有所帮助!

1、什么是动态组件

动态组件指的是动态切换组件的显示与隐藏。(学习视频分享:vue视频教程

2、如何实现动态组件渲染

vue 提供了一个内置的 <component> 组件,专门用来实现动态组件的渲染。示例代码如下:

3、使用 keep-alive 保持状态

默认情况下,切换动态组件时无法保持组件的状态。此时可以使用vue 内置的 <keep-alive> 组件保持动态组件的状态。示例代码如下:

4、keep-alive 对应的生命周期函数

  • 当组件被缓存时,会自动触发组件的 deactivated 生命周期函数。

  • 当组件被激活时,会自动触发组件的 activated 生命周期函数。

示例代码如下:

温馨提醒:

  • keep-alive 会把内部的组件进行缓存,而不是销毁组件;
  • 使用 keep-alive 的时候,可以通过 include 指定哪些组件需要被缓存;或者,通过 exclude 属性指定哪些组件不需要被缓存;但是:不要同时使用 includeexclude 这两个属性;

5、keep-alive 的 include 属性

include 属性用来指定:只有名称匹配的组件会被缓存。多个组件名之间使用英文的逗号分隔:

示例代码如下:

(学习视频分享:web前端开发、编程基础视频)

以上就是什么是动态组件?深入了解Vue中的动态组件的详细内容,更多请关注站长家园其它相关文章!

本文标签:  Vuevue.js

转载请注明来源:什么是动态组件?深入了解Vue中的动态组件

本文永久链接地址:https://www.adminjie.com/post/12990.html

免责声明:
本站所发布的一切资源仅限用于学习和研究目的;不得将上述内容用于商业或者非法用途,否则,一切后果请用户自负。本站信息来自网络,版权争议与本站无关。您必须在下载后的24个小时之内,从您的电脑中彻底删除上述内容。如果您喜欢该程序,请支持正版软件,购买注册,得到更好的正版服务。

附:
二○○二年一月一日《计算机软件保护条例》第十七条规定:为了学习和研究软件内含的设计思想和原理,通过安装、显示、传输或者存储软件等方式使用软件的,可以不经软件著作权人许可,不向其支付报酬!鉴于此,也希望大家按此说明研究软件!

版权声明:
一、本站致力于为软件爱好者提供国内外软件开发技术和软件共享,着力为用户提供优资资源。
二、本站提供的部分源码下载文件为网络共享资源,请于下载后的24小时内删除。如需体验更多乐趣,还请支持正版。
三、我站提供用户下载的所有内容均转自互联网。如有内容侵犯您的版权或其他利益的,若有侵犯你的权益请:提交版权证明文件到邮箱 2225329873#qq.com(#换为@) 站长会进行审查之后,情况属实的会在三个工作日内为您删除。

  • 站长家园(原代码之家)会员升级
  • 最新文章
    • 聊聊node+express怎么操作cookie

      聊聊node+express怎么操作cookie

      node+express怎么操作cookie?下面本篇文章就来给大家介绍一下用nodejs操作cookie的方法,希望对大家有所帮助!Cookie:有时也用其复...

    • 如何用好MySQL索引?你必须了解这些事!

      如何用好MySQL索引?你必须了解这些事!

      如何用好MySQL索引?下面本篇文章就来给大家分享一些想要用好MySQL索引,你必须知道的事情,希望对大家有所帮助!这一篇文章来聊一聊如何用好MySQL索引。为...

    • 什么是javascript对象的属性值

      什么是javascript对象的属性值

      javascript对象的属性值指的是与JavaScript对象相关的值;JavaScript对象是无序属性的集合,属性值通常可以被修改、添加和删除,但是某些属...

    • javascript中的方法不区分大小写吗

      javascript中的方法不区分大小写吗

      javascript中的方法是区分大小写的,因为JavaScript是一种区分大小写的语言,对变量方法的命名有严格的大小写敏感;在JavaScript中使用关键...

    • javascript中什么是继承

      javascript中什么是继承

      在JavaScript中,继承是一种允许在已有类的基础上创建新类的机制;继承为子类提供了灵活性,可以重用父类的方法和变量,继承的过程就是一般到特殊的过程,可以利...

    热门文章