某培训机构的总结的vue.js的常见面试问题，分为基础类和扩展类。
刚好最近也在学习vue.js框架，就查阅了官方文档，简单回答如下：
[基础类问题]
1. v-if 和 v-show 的区别是什么？
v-if 会根据条件构建或删除DOM，是存不存在的问题。
v-show 主要功能控制元素的 display 属性，是显不显示的问题。
参考资料：
- 官网文档：条件渲染 — Vue.js
2. $route和$router的区别是什么？
可以理解为，一个是用来获取路由信息的，一个是用来操作路由的
$route
route是路由信息对象，里面主要包含路由的一些基本信息，包括name、meta、path、hash、query、params、fullPath、matched、redirectedFrom
$router
router是VueRouter的实例，包含了一些路由的跳转方法，钩子函数等
3. 请举出Vue几种常用的指令
v-for 、 v-if 、v-bind、v-on、v-show、v-else
4. Vue常用的修饰符有哪些？
.prevent: 提交事件不再重载页面；.stop: 阻止单击事件冒泡；.self: 当事件发生在该元素本身而不是子元素的时候会触发；.capture: 事件侦听，事件发生的时候会调用
5. v-on可以绑定多个方法吗？
可以，一个元素可以有很多事件。比如：
6 . Vue中key值的作用？
当 Vue.js 用 v-for 正在更新已渲染过的元素列表时，它默认用“就地复用”策略。如果数据项的顺序被改变，Vue 将不会移动 DOM 元素来匹配数据项的顺序， 而是简单复用此处每个元素，并且确保它在特定索引下显示已被渲染过的每个元素。key的作用主要是为了高效的更新虚拟DOM。
当有相同标签名的元素切换时，需要通过key特性设置唯一的值来标记以让Vue区分它们，否则Vue为了效率只会替换相同标签内部的内部。
7. 什么是Vue的计算属性？
在模板中放入太多的逻辑会让模板过重且难以维护，在需要对数据进行复杂处理，且可能多次使用的情况下，尽量采取计算属性的方式。计算属性类似方法，其优点：
- 使得数据处理结构清晰；
- 依赖于数据，数据更新，处理结果自动更新；
- 计算属性内部this指向vm实例；
- 在template调用时，直接写计算属性名即可；
- 常用的是getter方法，获取数据，也可以使用set方法改变数据；
- 相较于methods，不管依赖的数据变不变，methods都会重新计算，但是依赖数据不变的时候computed从缓存中获取，不会重新计算。
参考资料：
- 官方文档：计算属性和侦听器 — Vue.js
8. 如何定义vue-router的动态路由，获取传过来的值？
在 router 目录下的 index.js 文件中，对 path 属性加上 /:id，使用 router 对象的 params.id 获取。
9. watch和computed的差异是什么？
在说差异之前，先说相似点：
watch和computed都是以Vue的依赖追踪机制为基础的，它们都试图处理这样一件事情：当某一个数据（称它为依赖数据）发生变化的时候，所有依赖这个数据的“相关”数据“自动”发生变化，也就是自动调用相关的函数去实现数据的变动。
主要差异：
- watch：当监测的属性变化时会自动执行对应的回调函数
- computed：计算的属性只有在它的相关依赖发生改变时才会重新求值
大多数情况下,计算属性更合适。当需要在数据变化时执行异步或开销较大的操作时，watch更合适。
参考资料：
- 官方文档：计算属性和侦听器 — Vue.js
10. 组件中data为什么是函数？
vue的data数据其实是vue组件原型上的属性，数据存在于内存当中。
一个vue组件就是一个vue实例。
在JS当中实例是通过构造函数来创建的，每个构造函数可以new出很多个实例，那么每个实例都会继承原型上的方法或属性。
vue组件为了保证每个实例上的data数据的独立性，规定了必须使用函数，而不是对象。
因为使用对象的话，每个实例（组件）上使用的data数据是相互影响的，这当然就不是我们想要的了。对象是对于内存地址的引用，直接定义个对象的话组件之间都会使用这个对象，这样会造成组件之间数据相互影响。
参考资料：
