面试准备-vue篇在MVVM模式中，viewModel通过数据双向绑定将model层和view层联系起来；view层触发

MVVM

model是数据层，view是视图层，viewModel为视图提供引擎，用来处理业务逻辑
在MVVM模式中，viewModel通过数据双向绑定将model层和view层联系起来；view层触发事件viewModel会处理事件，改变model层；model层的改变也会反映到viewModel层，通知view层更新视图；MVVM让view层和model层单独工作。
MVVM完全分离了view层，使得viewModel分离了很多逻辑，便于单元测试；MVVM模型也便于移植代码；但随着代码量的增加，viewModel承担了很多业务逻辑，会使得model层变的复杂，从而消耗相当大的内存。

vue生命周期（钩子函数）

vue的生命周期函数主要包括以下八个：beforeCreate，created(该函数一般用于请求数据，拿到data中定义的数据)，beforeMount，mounted(该函数一般用来操作dom)，beforeUpdate，updated，beforeDestroy，destroyed；
此外还有两个不常用的钩子函数：activated,deactivated(用于激活停用keep-alive组件)

computed中的getter和setter

computed:{
    fullName:{
        get:function(){
        	return this.firstName+''+this.lastName;
        },
        set:function(){
        	var names=newValue.split('');
        	this.firstName=names[0];
        	this.lastName=names[names.length-1];
        }
    }
}

watch监听对象

如果只是监听obj内的某一个属性变化，可以直接obj.key进行监听。

watch:{
    'obj.key':function(newQ,oldQ){
        this.answer = 'new';
    }
}

如果对整个obj深层监听

watch:{
    obj:{
        handler:function(newQ,oldQ){
            this.answer = 'new';
        },
        deep:ture,
        immediate:true
        //当值第一次进行绑定的时候并不会触发watch监听，使用immediate则可以在最初绑定的时候执行。
    }
}

v-for循环key的作用

vue的dom渲染是虚拟dom，数据发生变化时，diff算法会只比较更改的部分，如果数据项的顺序被改变，Vue将不是移动DOM元素来匹配数据项的改变，而是简单复用此处每个元素，并且确保它在特定索引下显示已被渲染过的每个元素。

vue中列表循环需加:key="唯一标识"，唯一标识可以是item里面id、index等，因为vue组件高度复用，增加Key可以标识组件的唯一性，为了更好地区别各个组件 key的作用主要是为了高效的更新虚拟DOM。

详细可点击：VUE中演示v-for为什么要加key

$nextTick

在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法，获取更新后的 DOM。

有些时候在改变数据后立即要对dom进行操作，此时获取到的dom仍是获取到的是数据刷新前的dom，无法满足需要，这个时候就用到了$nextTick。

// 修改数据
vm.msg = 'Hello'
// DOM 还没有更新
Vue.nextTick(function () {
  // DOM 更新了
})

$set

向响应式对象中添加一个属性，并确保这个新属性同样是响应式的，且触发视图更新。它必须用于向响应式对象上添加新属性，因为 Vue 无法探测普通的新增属性 (比如 this.myObject.newProperty = 'hi')（官方示例）

在vue中对一个对象内部进行一些修改时，vue没有监听到变化，也无法触发视图的更新，此时需要使用$set来触发更新，使视图更新为最新的数据。

组件间的传值

父传子：props；子传父：$emit；兄弟：eventbus；vuex；

详细可见：vue组件间传值的8种方式、 vue组件间六种通信方式

详细可见：面试题

面试准备-vue篇