持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第16天，[点击查看活动详情](juejin.cn/post/709970… "juejin.cn/post/709970…

Vue3 新特性

• 首先是向下兼容，Vue3 支持大多数 Vue2 的特性。甚至就拿 Vue2 的语法开发 Vue3，也是没有任何问题的。
• 性能的提升，每个人都希望使用的框架更快，更轻。Vue3 做到了，给开发者一个极致的体验。官方网站给出的数据是：打包大小减少 41%，初次渲染快 55%，更新快 133%，内存使用减少 54%。
• 新推出的Composition API ，在 Vue2 中遇到的问题就是复杂组件的代码变的非常麻烦，甚至不可维护。说白了就是封装不好，重用不畅。这个Composition API一推出，立马解决了这个问题。它是一系列 API 的合集。
• 其他新特性：Teleport(瞬移组件)、Suspense(解决异步加载组件问题)和全局 API 的修改和优化。
• 更好TypeScript支持，Vue3 的源代码就是使用TypeScript进行开发的。所以在新的版本上使用TS也更加顺畅无阻。

一、composition-api

Vue在2.x中编写代码要按照一定的模板，比如数据就只能放在data()中，方法只能放在methods中，按照模板编写代码对于新手来讲可能是好事，但是一旦项目变大，维护起来就显得很困难。

下图的左边图示，即Vue2使用的Options-api，图中相同的颜色对应是组件的一种功能，可以看到为了实现一种功能，Options-api所写的代码是非常分散的。

Vue在2.x中编写代码要按照一定的模板，比如数据就只能放在data()中，方法只能放在methods中，按照模板编写代码对于新手来讲可能是好事，但是一旦项目变大，维护起来就显得很困难。