# Vue系列之1-概览
# 前言
2018年接触Vue,到现在已经3年了,中间通过自学、公司项目零零散散地学习了Vue的使用和原理。如今的前端,Vue和React已经是必备的技能,因此有必要回顾和总结,对Vue有一个系统性的认知。
本文是对Vue的系统性总结,主要涵盖以下几个部分:
- 概览:涵盖vue的诞生背景,它和其他mvvm的区别,以及未来的发展趋势等内容
- 使用:涵盖安装、基本使用、组件、高级特性等内容
- 周边工具:涵盖vue-router路由、vuex状态管理
- 原理:涵盖vue原理的三大因素,模板编译、数据响应式、虚拟dom和diff算法
- 常见问答:主要是汇总一些常见的vue问题和解答
- Vue3:涵盖新特性、原理和vite
希望通过本系列,能帮助你构建起vue的知识体系~
# 概览
Vue (opens new window) (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用提供驱动。
通过官方定义,我们知道Vue的一些特点:
- 轻量级渐进式框架(便于与第三方库或既有项目整合)
- 生态丰富(vue-cli、vue-router、vuex、社区UI组件库...)
- 易于上手(入门简单、中文文档友好)
那么,vue解决了什么问题?
- HTML:从0到1
- CSS:提供装饰
- JavaScript(DOM):支持页面动态化(例如倒计时)
- jQuery:解决浏览器兼容问题、优雅API(解放前端,造轮子)
- Angular/React/Vue:数据驱动视图,让开发者从DOM操作中解放(如倒计时,自加器)
前端三大框架对比
框架 | 发布年份 | 出自 | star数 | 特性 |
---|---|---|---|---|
Angular | 2010年 | 73.7k | 双向数据绑定 | |
React | 2013年 | 169k | VirtualDOM、Redux | |
Vue | 2014年 | 尤雨溪EvanYou | 184k | 更轻量、易于上手、中文文档友好 |
框架趋同/互相借鉴
- Vue借鉴knockout模板引擎、借鉴Angular双向数据绑定、借鉴React虚拟dom/redux/JSX
- 跨端开发(Ionic/ReactNative/Weex)
- 桌面开发(electron支持vue/react)
- 总之,你有我有全都有,大家好才是真的好
类vue的开发模式(新赛道):小程序、uniapp
vue3.0 vs react hooks
# 总结
本章主要介绍了vue的诞生背景,和其他mvvm的区别,以及未来的发展趋势等内容。