在vue2中的内置组件:

  动态路由中的 component :作用:动态显示路由的挂载点,使用 is 属性动态显示组件 ;

        keep-alive :作用:使被包裹的组件保留状态,避免被重新渲染 ;

  路由中的router-link :作用:和 超链接类似,使用 to 属性制定 url 跳转页面 ;

      router-view :路由出口 ;

vue3的新的内置组件:

  Fragment 组件 :

  描述:在 vue2.x 中组件模板必须要一个根标签;但是在 vue3.x 中不再需要一个根标签,它会自 动创建一个 Fragment ;在代码中是不显示的,可以在 vue.develop.js 插件中看到 ;

  Suspense 组件:

  作用: 加载异步组件的时候,渲染一些其他内容

  场景: 加载异步组件的时候渲染 加载中

  把组件转换成异步组件的方式:

import { defineAsyncComponent } from 'vue';
const Child = defineAsyncComponent(() => import('./Child.vue'));

  Teleport 组件

  作用: 将指定 DOM 内容移动到指定的某个节点里面(可以理解为将组件挂载到指定节点上面)

  使用场景: 弹框、播放器组件的定位

Vue3中的新的内置组件的更多相关文章

  1. Vue基础(环境配置、内部指令、全局API、选项、内置组件)

    1.环境配置 安装VsCode 安装包管理工具:直接下载 NodeJS 进行安装即可,NodeJS自带 Npm 包管理工具,下载地址:https://nodejs.org/en/download/安装 ...

  2. 通俗易懂了解Vue内置组件keep-alive内部原理

    1. 官方介绍及其用法 1.1 组件介绍 要想搞明白<keep-alive>组件的内部实现原理,首先我们得搞明白这个组件怎么用以及为什么要用它,关于<keep-alive>组件 ...

  3. Vue内置组件[回顾]

    1.动态组件 在某些场景,往往需要我们动态切换页面部分区域的视图,这个时候内置组件component就显得尤为重要. component接收一个名为is的属性,is的值应为父组件中注册过的组件的名称, ...

  4. Django:内置组件Content-Type

    12.Django组件之Content_Type 1.帮助我们生成了一张表,里面有所有表名.这样不再自建表在表中填表名,用Foreignkey获取 2.为了让我们快速进入插入数据,填写一个字段Gene ...

  5. vue-learning:33 - component - 内置组件 - 过渡组件transition

    vue内置过渡组件transition 目录 什么是过渡 基本过渡或动画实现的语法 css过渡动画:transition / animation js过渡:特定事件钩子函数 各种情形下的过渡实现,使用 ...

  6. 阅读vue源码-----内置组件篇(keep-alive)

    1.前言: <keep-alive>是vue实现的一个内置组件,也就是说vue源码不仅实现了一套组件化的机制,也实现了一些内置组件. <keep-alive>官网介绍如下:&l ...

  7. Ionic4.x Theming(主题) 增加内置主题 颜色 修改内置组件默认样式 修改底部 Tabs 背景颜色以及按钮颜色

    1.Ionic4.x Theming(主题) Ionic4.x 修改主题颜色的话需要在 src/theme/variables.scss 文件中修改. https://ionicframework.c ...

  8. form-create教程:给内置组件和自定义组件添加事件

    本文将介绍form-create如何给内置组件和自定义组件添加事件 form-create 是一个可以通过 JSON 生成具有动态渲染.数据收集.验证和提交功能的表单生成器.并且支持生成任何 Vue ...

  9. Python中匿名函数与内置高阶函数详解

    大家好,从今天起早起Python将持续更新由小甜同学从 初学者的角度 学习Python的笔记,其特点就是全文大多由 新手易理解 的 代码与注释及动态演示 .刚入门的读者千万不要错过! 很多人学习pyt ...

  10. vue第十一单元(内置组件)

    第十一单元(内置组件) #课程目标 熟练掌握component组件的用法 熟练使用keep-alive组件 #知识点 #1.component组件 component是vue的一个内置组件,作用是:配 ...

随机推荐

  1. 【OracleDB】 03 数据类型和常见对象概述

    我们可以通过PLSQL来查看Oracle的数据类型 总分类: - 字符型 1.CHAR 0 - 2000 字节 固定长度字符串 2.NCHAR 0 - 1000 字节 固定长度字符串[Unicode字 ...

  2. 【SpringBoot】整合Swagger 接口文档

    前言 可能运用的开发模式: SSM -> SpringMVC + Spring + Mybatis SSMP -> SpringMVC + Spring + MybatisPlus SM ...

  3. 如何理解计算机类论文、机器学习论文、人工智能AI论文中的“soft”和“hard”呢?

    如何理解计算机类论文.机器学习论文.人工智能AI论文中的"soft"和"hard"呢? 最近在看论文中总看到带有"soft"和"h ...

  4. 强化学习 —— reinforce算法中更新一次策略网络时episodes个数的设置对算法性能的影响 —— reinforce算法中迭代训练一次神经网络时batch_size大小的不同设置对算法性能的影响

    本文相关的博客:(预先知识) 强化学习中经典算法 -- reinforce算法 -- (进一步理解, 理论推导出的计算模型和实际应用中的计算模型的区别) 本文代码地址: https://gitee.c ...

  5. 华为最高学术成果发表 —— 《Nature》正刊发表论文《Accurate medium-range global weather forecasting with 3D neural networks》

    论文<Accurate medium-range global weather forecasting with 3D neural networks>的<Nature>地址: ...

  6. 【转载】 NFS服务器端的权限设置学习 Linux运维学习

    原文地址: http://blog.chinaunix.net/uid-31484238-id-5785140.html ======================================= ...

  7. IntersectionObserver + scrollIntoView 实现电梯导航

    电梯导航也被称为锚点导航,当点击锚点元素时,页面内相应标记的元素滚动到视口.而且页面内元素滚动时相应锚点也会高亮.电梯导航一般把锚点放在左右两侧,类似电梯一样.常见的电梯导航效果如下,比如一些官方文档 ...

  8. 从0实现基于Linux socket聊天室-多线程服务器模型-1

    前言 Socket在实际系统程序开发当中,应用非常广泛,也非常重要.实际应用中服务器经常需要支持多个客户端连接,实现高并发服务器模型显得尤为重要.高并发服务器从简单的循环服务器模型处理少量网络并发请求 ...

  9. 关于Arrays.asList返回List无法新增和删除?

    关于Arrays.asList返回的List无法新增和删除? 这个是在写项目的时候发现的,然后就分析了一下源码,得其内部原理 复现代码示例: public class ArraysAsList { p ...

  10. 【DVWA】搭建安全测试环境

    一.搭建DVWA环境 用docker输入命令: docker run -d --name zc_dvwa -p 8081:80 vulnerables/web-dvwa 安装完成: 输入地址:http ...