【vue面试题】1、vue优点轻量级速度快简单易学低耦合可重用性独立开发文档齐全，且文档为中文文档 2、v

1、vue优点

轻量级速度快简单易学低耦合可重用性独立开发文档齐全，且文档为中文文档 2、vue父组件向子组件传递数据

props

3、子组件向父组件传递事件

$emit$ refs props的函数闭包用法

4、v-show和v-if指令的共同点和不同点

相同点:都可以控制dom元素的显示和隐藏

不同点:v-show只是改变display属性，dom元素并未消失，切换时不需要重新渲染页面

v-if直接将dom元素从页面删除，再次切换需要重新渲染页面 5、如何让CSS只在当前组件中起作用

scoped 6、的作用是什么

主要是用于需要频繁切换的组件时进行缓存，不需要重新渲染页面

7、如何获取dom

给dom元素加ref=‘refname’,然后通过this.$refs.refname进行获取dom元素 8、说出几种vue当中的指令和它的用法

v-model

v-on

v-html

v-text

v-once

v-if

v-show 9、vue-loader是什么？它的用途是什么？

vue文件的一个加载器，将template/js/style转换为js模块

用途:js可以写es6、style样式 10、为什么用key

给每个dom元素加上key作为唯一标识，diff算法可以正确的识别这个节点，使页面渲染更加迅速。 11、axios及安装？

vue项目中使用ajax时需要axios插件

下载方式cnpm install axios --save 12、v-model的使用

v-model用于表单的双向绑定，可以实时修改数据 13、请说出vue.cli项目中src目录每个文件夹和文件的用法

components存放组件

app.vue主页面入口

index.js主文件入口

ass存放静态资源文件 14、分别简述computed和watch的使用场景

用官网的一句话来说，所有需要用到计算的都应该使用计算属性。多条数据影响一条数据时使用计算属性，使用场景购物车。

如果是一条数据更改，影响多条数据时，使用watch，使用场景搜索框。 15、v-on可以监听多个方法吗？

可以，比如 v-on=“onclick,onbure” 16、$nextTick的使用

在data()中的修改后，页面中无法获取data修改后的数据，使用$nextTick时，当data中的数据修改后，可以实时的渲染页面

17、vue组件中data为什么必须是一个函数？

因为javaScript的特性所导致，在component中， data必须以函数的形式存在，不可以是对象。

组件中的data写成一个函数，数据以函数返回值的形式定义，这样每次复用组件的时候，都会返回一份新的data，相当于每个组件实例都有自己私有的数据空间，他们值负责各自维护数据，不会造成混乱。而单纯的写成对象形式，就是所有组件实例共用了一个data，这样改一个全部都会修改。 18、渐进式框架的理解

主张最少

可以根据不同的需求选择不同的层级 19、vue在双向数据绑定是如何实现的？

vue双向数据绑定是通过数据劫持、组合、发布订阅模式的方式来实现的，也就是说数据和视图同步，数据发生变化，视图跟着变化，视图变化，数据也随之发生改变

核心：关于vue双向数据绑定，其核心是Object.defineProperty()方法 20、单页面应用和多页面应用区别及缺点

单页面应用（SPA），通俗的说就是指只有一个主页面的应用，浏览器一开始就加载所有的js、html、css。所有的页面内容都包含在这个主页面中。但在写的时候，还是分开写，然后再加护的时候有路由程序动态载入，单页面的页面跳转，仅刷新局部资源。多用于pc端。

多页面（MPA），就是一个应用中有多个页面，页面跳转时是整页刷新

单页面的优点：用户体验好，快，内容的改变不需要重新加载整个页面，基于这一点spa对服务器压力较小；前后端分离，页面效果会比较酷炫

单页面缺点：不利于seo；导航不可用，如果一定要导航需要自行实现前进、后退。初次加载时耗时多；页面复杂度提高很多。 21、Vue 项目中为什么要在列表组件中写 key，其作用是什么？

key是给每一个vnode的唯一id,可以依靠key,更准确, 更快的拿到oldVnode中对应的vnode节点。

更准确因为带key就不是就地复用了，在sameNode函数 a.key === b.key对比中可以避免就地复用的情况。所以会更加准确。更快利用key的唯一性生成map对象来获取对应节点，比遍历方式更快。

22、父组件和子组件生命周期钩子执行顺序是什么？

加载渲染过程父 beforeCreate -> 父 created -> 父 beforeMount -> 子 beforeCreate -> 子 created -> 子 beforeMount -> 子 mounted -> 父 mounted

子组件更新过程父 beforeUpdate -> 子 beforeUpdate -> 子 updated -> 父 updated

父组件更新过程父 beforeUpdate -> 父 updated