一、MVVM模型
●model->data数据
●view->dom模型，
●viewModel->视图模型，实例。相当于一个桥梁 二、Vue中响应式数据的理解
三、Vue如何检测数组变化
- push：后面新增一个元素
- pop：删除一个元素
- shiftl：删除第一个元素
- unshift：前面加一个元素
- splice：指定位置删除/添加/替换一个元素
- sort：数组进行排序
- reverse：反转数组
四、Vue2组件生命周期有哪些？
- beforeCreate():在实例初始化之后，event,watch事件之前
- Created():可以访问到data数据，数据代理
- beforeMount():解析模板，生成虚拟dom
- Mounted():解析模板到真实dom,页面渲染
- beforceUpdate()：数据更新，发生在虚拟dom
- Update():真实dom，渲染到页面
- beforceDestory:实例销毁前调用
- Destory:实例销毁之后调用，调用后Vue实例的所有东西都会被解绑，所有的事件监听会被移除，子实例被销毁，该钩子在服务端渲染期间不被调用。
五、nextTick
this.$nextTick(回调函数)在下一次DOM更新结束后执行其指定的回调
什么时候用:当改变数据后，要基于更新后的新DOM进行某些操作时，要在nextTick所指定的回调函数中执行
六、computed和watch的区别
-
computed能完成的功能,watch都可以完成。
- 定义:要用的属性不存在，需要通过已有属性计算得来
- 底层借助了0bjcet.defineproperty()方法提供的 getter和setter
-
watch能完成的功能，computed不一定能完成，例如: watch可以进行异步操作。
- watch是监控值的变化，当值发生改变的时候，会调用回调函数
七、说明key的作用和原理
- 没有key会导致更新的时候出问题
- 尽量不要采用索引作为key
八、组件的理解
定义：局部功能代码和资源的集合
九、vue的修饰符有哪些
- prevent:阻止默认事件（常用);
- stop:阻止事件冒泡（常用);
- once:事件只触发一次（常用）;
- capture:使用事件的捕获模式;
- self:只有event.target是当前操作的元素是才触发事件;
- passive:事件的默认行为立即执行，无需等待事件回调执行完毕;
十、vue-router有几种钩子函数？执行流程如何？
- 全局守卫
- 路由守卫
- 组件守卫
十一、vuerouter的两种模式的区别
- vue-router中有三种模式，分别是hash、history、abstract
- abstract在不支持浏览器的API换景使用
- hash模式兼容性好，但是不美观，不利于SEO
- history美观，historyAPI+popState，但是刷新会出现404
十二、Vue的性能优化有哪些？
- 数据层级不要过深，合理的设置响应式数据
- 使用数据时，缓存值的结果，不频繁取值
- 合理设置key
- v-show(频繁切换性能高)和v-if的合理使用
- 控制组件的粒度 -> Vue采用组件级别更新
- 采用函数式组件 -> 函数式组价开销低
- 采用异步组件 -> 借助webpack的分包策略
- 使用keep-alive来缓存组件
- 虚拟滚动、时间分片等策略
- 打包优化
十三、v-if,v-show的区别
- 展示形式不同
- v-if是 创建一个dom节点
- v-show 是display:none 、 block ，隐藏
- 使用场景不同
- 初次加载v-if要比v-show好，页面不会做加载盒子
- 频繁切换v-show要比v-if好，创建和删除的开销太大了，显示和隐藏开销较小