Vue3.js介绍

本文章将从Vue的概念出发，介绍Vue的特色以及其他前端框架的不同，同时介绍Vue3.0的一些新特性。

Part One

概念

Vue是一种模型-视图-视图模型（Model-View-ViewModel,MVVM）,View和Model是独立的，ViewModel 是View和Model交互的桥梁在。当View的某个部分需要更新时，Vue会自动选择恰当的方法和时机进行更新。

Vue的开发者将其称为渐进式框架。与其他重量级框架不同的是，Vue的核心库只关心注视图层，而且被设计为可以自低向上逐层应用。得益于Vue简单的API，以及可以阶段性使用的特点，使得Vue十分容易上手。同时，它与第三方库或既有项目的整合也十分便捷。

Part Two

Vue与其他框架

在MVVM框架中，Vue的表现十分优秀，原因在于Vue汲取了其他框架（如React、Angular等）的优势，这一部分会对比Vue与其他框架。

（一）Vue 与 React

React 的特点是使用 JavaScript 语言就可以编写前后端，因此HTML 代码需要写在 JavaScript 文件中，同时前后端代码需要写在一起。也叫做“多语言混合式编程”，导致代码难理解、调试。

例如：

在 React 应用中，当某个组件的状态发生改变时，它会以该组件为根，重新渲染整个组件子树，其中对于不必要子组件的重渲染则需要手动控制。但 Vue ,组件的依赖是在渲染过程中自动追踪的，方便开发者。

（二）Vue 与 Angular

Angular 具有优秀的组件系统，重写过的Angular 有着很快的速度，在性能测试数据上与 Vue 十分接近。

对于学习者来说，更容易的上手的最受欢迎，Vue的学习依靠HTML 和 JavaScript 基础，而Angular  的学习曲线则比较陡峭，初学者上手有些困难。

Part Three 

Vue3.0 的新特性

Vue3.0 引入了Composition API，在代码组织模式上更加灵活，类型推导也更稳定，使得Vue 在大型应用中更有竞争力。

提供Teleport ，允许开发者控制在DOM中哪个父节点下呈现HTML,实现时不必求助于全局状态或将其拆分为两个组件。

组件可以有多个根节点，即片段，前提是开发者明确定义属性应该分布在哪里。

以上是偏理论的东西，了解即可，希望对你有帮助！( •̀ ω •́ )✧