vue相关面试题第一篇
1.vue最大的特点是什么？
是组件化和数据驱动 组件化就是把一个页面封装成多个组件,写页面的过程就是写组件。数据驱动指的是视图是由数据驱动生成的，我们对视图的修改，不会直接操作 DOM，而是通过修改数据。
2.说一下 vue 常用基本指令有哪些
- v-if：根据表达式的值的真假条件渲染元素。在切换时元素及它的数据绑定 /组件被销毁并重建。
- v-show：判断真假值，条件和v-if一样，切换元素的 display CSS 属性。
- v-for：循环指令，基于一个数组或者对象渲染一个列表，vue 2.0以上必须需配合key值使用。
- v-bind：动态地绑定一个或多个特性，或一个组件 prop 到表达式。
- v-on：用于监听指定元素的 DOM 事件，比如点击事件。绑定事件监听器。
- v-model：实现表单输入和应用状态之间的双向绑定
- v-once：只渲染元素和组件一次。随后的重新渲染，元素/组件及其所有的子 节点将被视为静态内容并跳过。这可以用于优化更新性能。
3.Vue 常用的修饰符
v-on 指令常用修饰符：
- stop - 调用 event.stopPropagation()，禁止事件冒泡。
- prevent - 调用 event.preventDefault()，阻止事件默认行为。
- capture - 添加事件侦听器时使用 capture 模式。
- self - 只当事件是从侦听器绑定的元素本身触发时才触发回调。
- {keyCode | keyAlias} - 只当事件是从特定键触发时才触发回调。
- native - 监听组件根元素的原生事件。
- once - 只触发一次回调。
- left - (2.2.0) 只当点击鼠标左键时触发。
- right - (2.2.0) 只当点击鼠标右键时触发。
- middle - (2.2.0) 只当点击鼠标中键时触发。
- passive - (2.3.0) 以 { passive: true } 模式添加侦听器
4.Vue 组件中 data 为什么必须是函数
因为一个组件是可以复用的，但他们的 data 应该是私有的，如果在里面直接返回一 个对象.而不是函数的话,在组件复用的时候,就会影响其他的组件 而我们以函数的方式 返回,就是一个新的 data 对象，在堆内存里面指向的就是不同的空间地址.就不会影响 了.
5.v-if 和 v-show 的区别
v-if 和 v-show 都可以显示和隐藏一个元素，但有本质区别 v-if 是惰性的，只是值为 false 就不会加载对应元素，为 true 才动态加 载对应元素 v-show:是无论为 true 和为 false 都会加载对应 html 代码，但为 false 时用 display:none 隐藏不在页面显示，但为 true 时页面上用 display:block 显示其效果，我建议当切换频繁的时候用v-show,不频繁用v-if
6.如果问到vue生命周期的话
我写过关于vue生命周期的文章，可以去看一下
7.vue组件通讯
- 第一种：父传子：主要通过 props 来实现的
- 第二种：子传父：主要通过$emit 来实现
- 第三种：兄弟之间传值有两种方法：方法一：通过 event bus 实现，方法二：通过 vuex 实现
8.对单向数据流的理解
单向数据流主要是 vue 组件间传递数据是单向的，即数据总是由父组件 传递给子组件，子组件在其内部维护自己的数据，但它无权修改父组件传递给它 的数据，当开发者尝试这样做的时候，vue 将会报错。这样做是为了组件间更好 的维护。
9.说一下vue双向数据绑定的原理
核心主要利用 ES5 中的 Object.defineProperty 实现的，然后利用里面 的 getter 和 setter 来实现双向数据绑定的 10. vue 中 methods,computed,watch 的区别 methods 中都是封装好的函数，无论是否有变化只要触发就会执行 computed:是vue独有的特性计算属性，可以对data中的依赖项再重新计算， 得到一个新值，应用到视图中，和 methods 本质区别是 computed 是可缓存的， 也就是说computed 中的依赖项没有变化，则computed中的值就不会重新计算， 而 methods 中的函数是没有缓存的。Watch 是监听 data 和计算属性中的新旧变化。
