当前文档 《Vue.js v3.0 教程（Vue3 教程）》 由 进击的皇虫 使用 书栈网 (BookStack.CN) 进行构建，生成于 2020-10-21。 书栈网仅提供文档编写、整理、归类等功能，以及对文档内容的生成和导出工具。 文档内容由网友们编写和整理，书栈网难以确认文档内容知识点是否错漏。如果您在阅读文档获取 知识的时候，发现文档内容有不恰当的地方，请向我们反馈，让我们共同携手，将知识准确、高效且有 Vue.js 添加到项目中有三种主要方式。 1. 在页面上以 CDN package 的形式导入。 2. 使用 npm 安装它。 3. 使用官方的 CLI 来构建一个项目，它为现代前端工作流程提供了功能齐备的构建设置 (例如， 热重载、保存时的提示等等)。 最新版本： npm@next npm@next v3.0.2 v3.0.2 每个版本的详细发行说明可在 GitHub (opens new (opens new window)，可以 大幅提升安装速度。 安装 - 11 - 本文档使用 书栈网 · BookStack.CN 构建 提示 已经了解 Vue 2，只想了解 Vue 3 的新功能可以参阅迁移指南! Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的 是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第

探索Vue的⾼高级应⽤用 Ant Design Vue ⾥里里的那些”⿊黑科技” 唐⾦金金州 搜狗、蚂蚁⾦金金服、⼀一点资讯 Ant Design Vue的诞⽣生 遇到的问题及解决⽅方案 现状及未来规划 Ant Design Vue的诞⽣生 Why How 不不要怂 就是⼲干 站在巨⼈人的肩膀上 UI=fn(state) 脚本转换 属性声明\传递、状态声明 ⽅方法 or 事件 状态异步、同步问题 52个组件 单测覆盖率86% Star 3000+ 特⾊色 受控/⾮非受控组件 基于组件的国际化配置(36种语⾔言包) 共享Antd设计资源(Sketch、Axure等) ⼀一致的API 未来规划 提升单测覆盖率 TypeScript⽀支持 周边⽣生态建设 性能优化 总结 姿(zhi)势(shi)很重要 Q&A

构时，一次性全部解决。 Ant Design Vue 1.x 仅支持 Vue 2 ，2.x 是为了 Vue 3 开发的兼容版，并没有任何新特性，大多数的 API 也只是为了更好的兼容 Vue 3 ，3.x 版在易用性、功能、性能上都有了很大的提升，可以说是对 ue 3 比较成熟支持的版本了。 浏览器兼容性 Element Plus 和 Ant Design Vue 3 都已不在支持 IE 了，并不是他们自己放弃了 Element Plus 使用到了 ResizeObserver，如有兼容性需求可自行引入 resize-observer-polyfill。详 请参阅 ResizeObserver 的兼容性。 组件功能与特点 Element Plus 共 68 个组件，Ant Design Vue 3.x 共 64 个组件。 ● table 组件：Element Plus 自带 virtual scroll ，Ant TreeSelect 组件：Ant Design tree 组件写自定义内容不方便。而 Element 更好用。 ● form 表单组件：两个框架功能基本一致，包含数据收集，表单校验和提交功能。 input、checkb x 、select 等常用功能两个框架都有。 ● Ant Design Vue 2 & 3 是最早支持 Vue 3 的框架之一，新版本解决了很多 Vue 用户群在旧版本 喜欢的「单向数据流

上下⽂丢失 有限的类型⽀持 按 API 类型组织 极易复⽤ (原⽣ JS 函数) 可灵活组合 (⽣命周期钩⼦可多次使⽤) 提供更好的上下⽂⽀持 更好的 TypeScript 类型⽀持 按功能/逻辑组织 可独⽴于 Vue 组件使⽤ 对象式 API 存在的问题 组合式 API 提供的能⼒ 什么是可组合的函数 Dark 可复⽤逻辑的集合，专注点分离 export function ref const value = unref(arg) // 得到值 } 由 Ref 组成的对象 可以直接使⽤ ES6 解构其中的 Ref 使⽤ 根据使⽤⽅式，当想要⾃动解包的功能时，可以 使⽤ reactive 将其转换为对象 模式 以在使⽤可组合的函数式，同时获得 ref 和 reactive 的好处。 ` ` ` ` import { ref, reactive