Vue.js 实战教程 V2.xVue.js简介

Posted 2022-07-21 daqiang123

 

2.1 Vue.js概述

Vue (读音 /vju?/，类似于 view) 是一套用于构建用户界面的渐进式框架。

 

 

 

 

Vue.js官网的截图（2019年7月）

 

 

 

易用

会html、CSS、javascript就可以构建应用。 

 

灵活

可以在一个库和一套完整框架之间自如伸缩。

 

高效

20kB运行大小，超快虚拟 DOM，最省心的优化

 

2.2与React对比

 

 

 

React官网的截图（2019年7月）

 

 

 

性能

React 和 Vue 都是非常快的。

 

优化

在 Vue 应用中，组件的依赖是在渲染过程中自动追踪的，所以系统能精确知晓哪个组件确实需要被重渲染。Vue 的这个特点使得开发者不再需要考虑此类优化，从而能够更好地专注于应用本身。

 

HTML & CSS

在 React 中，一切都是 JavaScript。不仅仅是 HTML 可以用 JSX 来表达，现在的潮流也越来越多地将 CSS 也纳入到 JavaScript 中来处理。Vue 的整体思想是拥抱经典的 Web 技术，并在其上进行扩展。

 

向上扩展

Vue 的路由库和状态管理库都是由官方维护支持且与核心库同步更新的。React 则是选择把这些问题交给社区维护，因此创建了一个更分散的生态系统。但相对的，React 的生态系统相比 Vue 更加繁荣。

 

最后，Vue 提供了 CLI 脚手架，能让你通过交互式的脚手架引导非常容易地构建项目。你甚至可以使用它快速开发组件的原型。React 在这方面也提供了 create-react-app。

 

向下扩展

React 学习曲线陡峭，在你开始学 React 前，你需要知道 JSX 和 ES2015，因为许多示例用的是这些语法。

 

就像 Vue 向上扩展好比 React 一样，Vue 向下扩展后就类似于 jQuery。

 

原生渲染

React Native 能使你用相同的组件模型编写有本地渲染能力的 APP (ios 和 android)。能同时跨多平台开发，对开发者是非常棒的。

 

相应地，Vue 和 Weex 合作，Weex 允许你使用 Vue 语法开发不仅仅可以运行在浏览器端，还能被用于开发 iOS 和 Android 上的原生应用的组件。

 

2.3与Angular对比

 

 

 

Angular官网的截图（2019年7月）

 

TypeScript

Angular必须用 TypeScript 来开发。

 

在中小型规模的项目中，用 Vue 会是更好的选择。

 

性能

这两个框架都很快。

 

体积

在体积方面，一个包含了 Vuex + Vue Router 的 Vue 项目 (gzip 之后 30kB) 相比使用了这些优化的 angular-cli 生成的默认项目尺寸 (~65KB) 还是要小得多。

 

灵活性

Vue 相比于 Angular 更加灵活。

 

学习曲线

要学习 Vue，你只需要有良好的 HTML 和 JavaScript 基础。

 

Angular 的学习曲线是非常陡峭的——作为一个框架，它的 API 面积比起 Vue 要大得多，你也因此需要理解更多的概念才能开始有效率地工作。当然，Angular 本身的复杂度是因为它的设计目标就是只针对大型的复杂应用；但不可否认的是，这也使得它对于经验不甚丰富的开发者相当的不友好。

 
欢迎观看视频教程：https://ke.qq.com/course/432961?tuin=36914f34，如有疑问，请加QQ群665714453交流讨论。