Vue入门介绍

vue到底是个什么鬼？

我的天哪，不是吧，阿sir，不会有人到现在都还不知道vue吧！！！
你个技术汉奸

vue官网 ：https://cn.vuejs.org/v2/guide/

一， 什么是Vue ？

.Vue 是一套用于构建用户界面的渐进式框架
它就是一个js库，并且无依赖别的js库，跟jquery差不多。vue的核心库只关注视图层，非常容易与其它库或已有项目整合。Vue.js是一个轻巧、高性能、可组件化的MVVM库，同时拥有非常容易上手的API。

vue优点

轻量级框架：
只关注视图层，是⼀个构建数据的视图集合，⼤⼩只有⼏⼗kb；
国⼈开发
简单易学：中⽂⽂档，不存在语⾔障碍，易于理解和学习；
双向数据绑定：
保留了angular的特点，在数据操作⽅⾯更为简单；
组件化：
保留了react的优点，实现了html的封装和重⽤，在构建单⻚⾯应⽤⽅⾯有着独特的优势；
视图，数据，结构分离：
使数据的更改更为简单，不需要进⾏逻辑代码的修改，只需要操作数据就能完成相关操作；
虚拟DOM：
dom操作是⾮常耗费性能的，不再使⽤原⽣的dom操作节点，极⼤解放dom操作，但具体操作的还是dom不过是换了另⼀种⽅式；运⾏速度更快:相⽐较与react⽽⾔，同样是操作虚拟dom，就性能⽽⾔，vue存在很⼤的优势。

二， 框架和库的区别

1.库（插件）：是一种封装好的特定方法集合，对项目的侵入性较小，提供给开发者使用，控制权在使用者手中，如果某个库无法完成某些需求，可以很容易切换到其它库实现需求
2.框架：是一套架构，会基于自身特点向用户提供一套相当完整的解决方案，而且控制权在框架本身；对项目的侵入性较大，使用者要按照框架所规定的某种特定规范进行开发，项目如果需要更换框架，则需要重新架构整个项目

1.目前的流行前端框架Angular Vue React
2.流行的一些库jquery ，Zepto

三，为什么要学习Vue框架

1.从历史的潮流来说，人们从之前的:原生JS -> Jquery之类的类库 -> 前端模板引擎 ,他们都有一个共同的特点需要我们去操作dom元素
2.vue 和上面这些不一样能够帮助我们减少不必要的DOM操作;提高渲染效率;双向数据绑定的概念【通过框架提供的指令，我们前端程序员只需要关心数据的业务逻辑，不再关心DOM是如何渲染的了】

四，Vue作为前端框架的特点

1.构建用户界面，只需要关系view层
2.简单易学，轻量快速
3.渐进式框架

五，什么是渐进式

1.渐进式就跟这个图片一样，开发可以根据需求，逐渐递增所要的方式，但每个方式的依赖性不是很强

六，Vue的两核心

vue.js的两大核心：1. 数据驱动 ------------- 2.组件系统

> 1. 数据驱动，也就是数据的双向绑定

Vue 响应式核心就是，getter 的时候会收集依赖，setter 的时候会触发依赖更新

vue将遍历data中对象的所有property，并使用 Object.defineProperty 把这些 property 全部转为
getter/setter。

这些 getter/setter 对用户来说是不可见的，但是在内部它们让 Vue 能够追踪依赖，在 property
被访问和修改时通知变更。

每个组件实例都对应一个 watcher 实例，它会在组件渲染的过程中把“接触”过的数据 property 记录为依赖。

getter
的时候我们会收集依赖，依赖收集就是订阅数据变化watcher的收集，依赖收集的目的是当响应式数据发生变化时，能够通知相应的订阅者去处理相关的逻辑。

setter 的时候会触发依赖更新，之后当依赖项的 setter 触发时，会通知 watcher，从而使它关联的组件重新渲染。

> 2. 组件系统 组件的核心选项

1 模板（template）：模板声明了数据和最终展现给用户的DOM之间的映射关系。

2 初始数据（data）：一个组件的初始数据状态。对于可复用的组件来说，这通常是私有的状态。

3 接受的外部参数(props)：组件之间通过参数来进行数据的传递和共享。

4 方法（methods）：对数据的改动操作一般都在组件的方法内进行。

5 生命周期钩子函数（lifecycle hooks）：一个组件会触发多个生命周期钩子函数，最新2.0版本对于生命周期函数名称改动很大。

6
私有资源（assets）：Vue.js当中将用户自定义的指令、过滤器、组件等统称为资源。一个组件可以声明自己的私有资源。私有资源只有该组件和它的子组件可以调用。