vue3新特性的使用
1、Suspense组件:等待异步组件时渲染一些额外内容,让应用有更好的用户体验
例:
<template>
<div class="app">
<h3>我是App组件</h3>
<Suspense>
<template v-slot:default>
<Child/>
</template>
<template v-slot:fallback>
<h3>加载中.....</h3>
</template>
</Suspense>
</div>
</template>
2、defineAsyncComponent:延迟加载组件
- <component :is="components.get('Form'+formname(store.getters.getapplyData.formid[0]))"></component>
- // 需要加载的组件集合
- const components = markRaw(new Map<string, any>())
- for(let i=0;i<5;i++){
- components.set(
- `Form${i+1}`,
- defineAsyncComponent(() => import('../../components/Form'+(i+1)+'.vue'))
- )
- }
3、markRaw:当渲染具有不可变数据源的大列表时,跳过响应式转换可以提高性能
- const components = markRaw(new Map<string, any>())
- for(let i=0;i<5;i++){
- components.set(
- `Form${i+1}`,
- defineAsyncComponent(() => import('../../components/Form'+(i+1)+'.vue'))
- )
- }
将components变成不响应式的,提高性能
vue3新特性的使用的更多相关文章
- Vue3 新特性
一.vue3 为什么要重写 两个主要原因考虑重写vue新版本主要功能: 1.主流浏览器对新的JavaScript语言特性的普遍支持. 2.当前Vue代码库随着时间的推移而暴露出来的设计和体系架构问题. ...
- 尝鲜 vue3.x 新特性 - CompositionAPI
0. 基础要求 了解常见的 ES6 新特性 ES6 的导入导出语法 解构赋值 箭头函数 etc... 了解 vue 2.x 的基本使用 组件 常用的指令 生命周期函数 computed.watch.r ...
- vue3.0新特性以及进阶路线
Vue3.0新特性/改动 新手学习路线 ===> 起步 1. 扎实的 JavaScript / HTML / CSS 基本功.这是前置条件. 2. 通读官方教程 (guide) 的基础篇.不要 ...
- 通过10个实例小练习,快速熟练 Vue3.0 核心新特性
Vue3.0 发 beta 版都有一段时间了,正式版也不远了,所以真的要学习一下 Vue3.0 的语法了. GitHub 博客地址: https://github.com/biaochenxuying ...
- Vue3.0新特性
Vue3.0新特性 Vue3.0的设计目标可以概括为体积更小.速度更快.加强TypeScript支持.加强API设计一致性.提高自身可维护性.开放更多底层功能. 描述 从Vue2到Vue3在一些比较重 ...
- 简单梳理下 Vue3 的新特性
在 Vue3 测试版刚刚发布的时候,我就学习了下 Composition API,但没想到正式版时隔一年多才出来,看了一下发现还是增加了不少新特性的,在这里我就将它们一一梳理一遍. 本文章只详细阐述 ...
- react 16.8版本新特性以及对react开发的影响
Facebook团队对社区上的MVC框架都不太满意的情况下,开发了一套开源的前端框架react,于2013年发布第一个版本. react最开始倡导函数式编程,使用function以及内部方法React ...
- Vue 3.0 有哪些新特性值得我们提前了解
一.迎接 Vue 3.0 简介 Vue.js 作者兼核心开发者尤雨溪宣布 Vue 3.0 进入 Beta 阶段. 已合并所有计划内的 RFC 已实现所有被合并的 RFC Vue CLI 现在通过 ...
- SQL Server 2014 新特性——内存数据库
SQL Server 2014 新特性——内存数据库 目录 SQL Server 2014 新特性——内存数据库 简介: 设计目的和原因: 专业名词 In-Memory OLTP不同之处 内存优化表 ...
- ElasticSearch 5学习(10)——结构化查询(包括新特性)
之前我们所有的查询都属于命令行查询,但是不利于复杂的查询,而且一般在项目开发中不使用命令行查询方式,只有在调试测试时使用简单命令行查询,但是,如果想要善用搜索,我们必须使用请求体查询(request ...
随机推荐
- ArcGIS工具 - 统计要素数量
查询和统计是GIS中的重要功能之一.在ArcGIS中可以按属性信息.按空间位置关系进行查询和统计.今天为源GIS给大家分享使用ArcPy编程实现批量统计地理数据库要素类记录数量. 软件应用 统计单个图 ...
- Joplin修改笔记存储位置
默认存储路径 笔记的默认保存位置可以通过 工具 > 选项 > 通用选项 ,在最上方可以看到路径 使用Windows快捷方式启动 在Joplin的快捷方式上右击,选择属性,然后选择快捷方式选 ...
- Apache IoTDB C# SDK Apache-IoTDB-Client-CSharp
最近今天写了IoTDB的三篇相关文章,完成了安装部署和客户端连接: Windows Server上部署IoTDB 集群 DBeaver 连接IoTDBDriver 将IoTDB注册为Windows服务 ...
- C Primer Plus 5.11 編程練習
/*C Primer Plus (5.10) 9*/ 1 #include<stdio.h> 2 #define G 103 3 int main() 4 { 5 char ch=96; ...
- Flutter框架渲染流程与使用
Flutter简述 Flutter是一个UI SDK, 可以进行移动端(iOS, Android),Web端, 桌面,它是一个跨平台解决方法. Flutter的特点:美观,快速,高效,开放. 美观:F ...
- bind使用场景之一
- Serverless Streaming:毫秒级流式大文件处理探秘
摘要:本文将以图片处理的场景作为例子详细描述当前的问题以及华为云FunctionGraph函数工作流在面对该问题时采取的一系列实践. 文章作者|旧浪:华为云Serverless研发专家.平山:华为云中 ...
- .NET Core项目部署到Windows系统Docker
1.新建一个ASP.NET Core Web应用(模型-视图-控制器) 2. 项目启动Docker.Docker OS选择Windows 3.系统默认的dockerfile文件如下 #See http ...
- 利用Git+GitHub进行团队协作开发
自己之前写过两篇关于Git和GItHub使用的文章,分别是 浅谈使用git 进行版本控制博客链接:https://www.cnblogs.com/wj-1314/p/7992543.html 使用Gi ...
- go 神奇的错误 time.Now().Format("2006-01-02 13:04:05") 比北京时间大8小时
困倦的时候写了个个获取本地时间,打印总比当前时间大8小时,找了很久原因 package main import ( "fmt" "time" ) func ma ...