当前文档 《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 3.0 构时，一次性全部解决。 Ant Design Vue 1.x 仅支持 Vue 2 ，2.x 是为了 Vue 3 开发的兼容版，并没有任何新特性，大多数的 API 也只是为了更好的兼容 Vue 3 ，3.x 版在易用性、功能、性能上都有了很大的提升，可以说是对 ue 3 比较成熟支持的版本了。 浏览器兼容性 Element Plus 和 Ant Design Vue 3 都已不在支持 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 用户群在旧版本 喜欢的「单向数据流

等 ⾼高级特性。 Android Platform iOS Platform Web Platform React.js Library Vue.js Library 前端主导 ⽀支持最流⾏行行的框架 向阳⽽而⽣生 代码即将对外开源 （ 发布平台） User Code JavaScript Hippy 底层三⼤大特性 ⾼高性能可复⽤用滚动列列表 前端开发所熟悉的 复⽤用 拥抱标准 纯粹 只做移动端的实现 Hippy-Vue 特性 同⼀一套代码，三端运⾏行行： 移动端⽤用 Hippy-Vue 渲染原⽣生代码 浏览器器⾥里里⽤用原版 Vue 渲染⽹网⻚页代码 终端扩展 Vue.Native，可以通过它 判断是否在终端运⾏行行，访问原⽣生能⼒力力。 Hippy-Vue 特性 同样的 div 浏览器器⾥里里⽀支持的背景图样式 Hippy-Vue Hippy-Vue 同样⽀支持 跟浏览器器⼀一样通过 overflow 样式 确定滚动⽅方向 Hippy-Vue 特性 CSS display 参数⽀支持 none 值 v-show 照样使⽤用 Hippy-Vue 特性 textarea 跟浏览器器⼀一模⼀一样 v-model 直接⽤用来做数据绑定 Emoji ⽀支持没问题 ? Hippy-Vue 架构 Android Platform iOS

使⽤用⽅方式 mpvue 框架针对的使⽤用场景如何，在各种复杂的 场景下应该如何使⽤用，典型的使⽤用流程是怎样的？ 使⽤用 mpvue 之前 了了解⼩小程序能⼒力力 & 边界 了了解 Vue.js 特性 了了解前端构建 mpvue 做什什么 & 不不做什什么 设计⼀一种编码⽅方式 确定⼀一套语法集合 内置编译构建⼯工具 推荐示例例项⽬目模板 UI 组件库 常⽤用⼯工具库 第三⽅方平台⽀支持

webim是腾讯企点重要消息 通路之一，它实现了无需客 户端就可以和腾讯企点客户 端进行即时沟通，node.js主 要实现了消息通路的前端接 入层服务，本次将基于 webim接入层实现架构，柔 性服务特性，监控上报等方 面的实践进行分享 springswang(王 跃) 王跃，腾讯高级前端工程师，拥有10+年前端 开发经验。2013年加入腾讯，负责互娱自助营 销系统，道聚城等多个项目前端架构和开发，

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