关于vue

1.对于MVVM的理解

MVVM是 Model-View-ViewModel 的缩写。

Model：代表数据模型，也可以在Model中定义数据修改和操作的业务逻辑。我们可以把Model称为数据层，因为它仅仅关注数据本身，不关心任何行为。

View：用户操作页面，当ViewModel对Model进行更新的时候，会通过数据绑定更新到View。

ViewModel：业务逻辑层，View需要什么数据，ViewModel要提供这个数据；View有某些操作，ViewModel就要响应这些操作，所以可以说它是Model for View。

总结：MVVM模式简化了界面与业务的依赖，解决了数据频繁更新。MVVM在使用当中，利用双向绑定技术，使得Model变化时，ViewModel会自动更新，而ViewModel变化时，View也会自动变化。

2.开发中常用的指令有哪些？

• v-model：一般用在表达输入，很轻松的实现表单控件和数据的双向绑定。
• v-html：更新元素的innerHTML
• v-show 与 v-if：条件渲染，注意二者区别

使用了 v-if 的时候，如果值为false，那么页面将不会有这个html标签生成。v-show 则是不管值为true还是false，html元素都会存在，只是CSS中的display显示或隐藏。

•  v-on:click：可以简写为 @click，@绑定一个事件。如果事件触发了，就可以指定事件的处理函数。
• v-for：基于源数据多次渲染元素或模板块
• v-bind：当表达式的值改变时，将其产生的连带影响，响应式的作用与DOM

语法：v-bind:title="msg"

简写：:title="msg"

3.Vue 生命周期

vue生命周期总共分为8个阶段：创建前/后，载入前/后，更新前/后，销毁前/后。

• beforeCreate（创建前） vue实例的挂载元素 $el 和数据对象 data 都是 undefined ，还未初始化
• created（创建后） 完成了 data 数据初始化，el 还未初始化
• beforeMount（载入前） vue实例的 $el 和 data 都初始化了，相关的render函数首次被调用。实例已完成以下的配置：编译模板，把data里面的数据和模板生成html。注意此时还没有挂载html到页面上
• mounted（载入后） 在 el 被新创建的 vm.$el 替换，并挂载到实例上去之后调用。实例已完成以下的配置：用上面编译好的html内容替换el属性指向的DOM对象。完成模板中的html渲染到html页面中。此过程中进行ajax交互
• brforeUpdate（更新前） 在数据更新之前调用，发生在虚拟DOM重新渲染和打补丁之前。可以在该钩子中进一步地更改状态，不会触发附加的重渲染过程
• updated（更新后） 在由于数据更改导致的虚拟DOM重新渲染和打补丁之后调用。调用时，组件DOM已经更新，所以可以执行依赖于DOM的操作。然而在大多数情况下，应该避免在此期间更改状态，因为这可能会导致更新无限循环。该钩子在服务器端渲染器讲不被调用。
• beforeDestroy（销毁前） 在实例销毁之前调用。实例仍然完全可用
• destroyed（销毁后） 在实例销毁之后调用。调用后，所有的事件监听器会被移除，所有的子实例也会被销毁。该钩子在服务器端渲染期间不被调用

4.Vue的双向数据绑定原理是什么？

vue.js 是采用数据劫持结合发布者-订阅者模式的方式，通过Object.defineProperty() 来劫持各个属性的setter，getter，在数据变动时发布消息给订阅者，触发相应的监听回调。具体实现步骤：

1. 当把一个普通 Javascript 对象传给 Vue 实例来作为它的 data 选项时，Vue 将遍历它的属性，用 Object.defineProperty 都加上 setter和getter 这样的话，给这个对象的某个值赋值，就会触发setter，那么就能监听到了数据变化
2. compile解析模板指令，将模板中的变量替换成数据，然后初始化渲染页面视图，并将每个指令对应的节点绑定更新函数，添加监听数据的订阅者，一旦数据有变动，收到通知，更新视图
3. Watcher订阅者是Observer和Compile之间通信的桥梁，主要做的事情是: 1、在自身实例化时往属性订阅器(dep)里面添加自己 2、自身必须有一个update()方法 3、待属性变动dep.notice()通知时，能调用自身的update()方法，并触发Compile中绑定的回调，则功成身退。
4. MVVM作为数据绑定的入口，整合Observer、Compile和Watcher三者，通过Observer来监听自己的model数据变化，通过Compile来解析编译模板指令，最终利用Watcher搭起Observer和Compile之间的通信桥梁，达到数据变化 -> 视图更新；视图交互变化(input) -> 数据model变更的双向绑定效果