vue 进阶学习（一）： vue 框架说明和与其他框架的对比

• 2021 年 4 月 29 日
• 笔记
• VUE

vue 框架说明和与其他框架的对比

一、说明

是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用提供驱动。(来自官网 官网链接)

1. 说明分析

1. 只关注视图层（html、css、js），将其中的 View 的状态和行为抽象化，让我们将视图 UI 和业务逻辑分开。Vue.js 就是 MVVM 中的 ViewModel 层的实现者；核心就是实现 DOM 监听与数据绑定
2. 便于与第三方库或既有项目整合，vue 生态比较完善，其中有路由 ui 框架 element-ui、管理器 router、网络通信 axios、状态管理 vuex 等，这些后期会讲到
3. vue3.0 版本是基于 typeScript 编写的，可以更好的支持 TypeScripy

2. 特点

1. 轻量级，体积小，
2. 容易上手，学习曲线平稳，文档齐全
3. 结合了 Angular 的模块化和 React 的虚拟 DOM 的优点，并拥有自己独特的功能，如计算属性
4. 开源，社区活跃度高

MVVM 模式说明:

1. Model：模型层，表示 javascript 对象
2. View：视图层，表示 DOM，HTML 的操作元素
3. ViewModel：连接视图和数据的中间件，双向绑定，

TypeScript:

1. 微软的标准，通过 webpack 打包成 javascript；vue3.0 以上版本支持 typeScript

二、对比其他框架

1. javascript，原生 js，是基于标准规范 ECMAScript （ES）开发；

   • ES6：目前主流版本，设计思想是尽量模块化，使编译时就能确定模块的依赖关系，以及输出和输入的变量 ；可以通过 webpack 打包成为 ES5
   • ES5：全浏览器都支持

2. jQuery 框架：主要简化 DOM 操作；

3. Angular js：Google 收购的前端框架，java 开发者开发，将 java 的 mvc 模型搬到了前端，增加了模块化开发理念，与微软合作，采用 TypeScript 开发

4. React：Facebook 出品，虚拟 DOM，基于内存的，运行时性能和 vue 差不多；

5. Vue：一款渐进式 javaScript 框架，用于构建用户界面（视图层），集成 Angular 和 REact 优点（模块化 mvvm-异步通信 和虚拟 DOM 技术），Vue 边界明确，只是为了处理 DOM，不具备通信能力，因此需要额外的通信框架和服务器交互，可以使用 Axios 或者 jQuery 的 ajax

6. 常用的 UI 框架：bootstrap、EasyUI、Element-UI、e-view、LayUI（类 UI），配合vue的时Element-UI