vue
1、 你知道vue的模板语法用的是哪个web模板引擎的吗？说说你对这模板引擎的理解
Vue使用了Mustache语法，即双大括号的语法。
原生input其实只是一个语法糖，:bind="value"与@change="value = $event.target.value"的结合。
自定义组件的时候的v-model默认监听change事件和绑定value 的prop。
采用i18n来解决国际化问题，关于语言环境的存储方案，看到有同学解答localStorage的方式，个人认为这种还是采用Cookie的存储方法，通过路由实现不同模块加载不同的国际化配置文件
我个人网站的多语言是用vuex实现的，所有语言对于信息都命名，存在后端，由restful接口返回，在切换语言时触发dispatch，调用接口，在所有页面里mapState拿到语言配置，渲染上去
4、 在使用计算属性的时，函数名和data数据源中的数据可以同名吗？
不可以，同名会报错：The computed property "xxxx" is already defined in data
初始化vm的过程，会先把data绑定到vm,再把computed的值绑定到vm，会把data覆盖了
可以同名，但data会覆盖methods。并且本就不该同名，同名说明你命名不规范。
写在计算属性中的数据名称，不能在data中定义,因为不管是计算属性还是data还是props 都会被挂载在vm实例上，因此这三个都不能同名
然后解释为什么会覆盖，因为Props、methods、data、computed、watch都是在initState函数中被初始化的。初始化顺序就是我上面给出的顺序，本质上这些都是要挂载到this上面的，你如果重名的话，后面出现的属性自然而然会覆盖之前挂载的属性了。如果你的eslint配置比较严格的话，同名是编译不通过的。
5、 vue中data的属性可以和methods中的方法同名吗？为什么？
同4
1、通过prototype，这个非常方便。Vue.prototype[method]=method;
2、通过插件Vue.use(plugin)；
3、通过mixin，Vue.mixin(mixins);
7、 vue2.0不再支持v-html中使用过滤器了怎么办？
1：全局方法
2：computed
3：$options.filters
设置assetsPublicPath将 assetsPublicPath: '/' 改为 assetsPublicPath: './'
因为动态添加src被当做静态资源处理了，没有进行编译，所以要加上require。require('@/assets/images/xxx.png')
ssr,即单页面后台渲染
vue-meta-info 与prerender-spa-plugin 预渲染
nuxt，但是nuxt部署有一定局限性，需要服务器配置node环境
phantomjs针对爬虫做处理
11、跟keep-alive有关的生命周期是哪些？描述下这些生命周期
activated和deactivated
keep-alive的生命周期
1.activated： 页面第一次进入的时候，钩子触发的顺序是created->mounted->activated
2.deactivated: 页面退出的时候会触发deactivated，当再次前进或者后退的时候只触发activated
12、 如果现在让你从vue/react/angularjs三个中选择一个，你会选哪个？说说你的理由
首先会根据团队的技术栈来进行选型，有利于团队管理及技术交流，在此基础上不断演化出适合公司内部的实现方式；
抛开团队来说的话，个人会选择vue，原因是:
一直接触的都是vue，目前没有什么痛感，喜欢使用模板
轻量、语法简单，支持模板和渲染函数的弹性选择
更快的渲染+更小的体积
1、使用v-for时记得加key，可以快速定位到需要更新的DOM节点，提高效率。
2、永远不要把 v-if 和 v-for 同时用在同一个元素上。提高渲染效率
3、优先通过 Vuex 管理全局状态，而不是通过 this.$root 或一个全局事件总线
4、为组件样式设置scoped作用域
16、 你是从vue哪个版本开始用的？你知道1.x和2.x有什么区别吗？
vue1.0的数据绑定完全依赖于数据侦测，使用Object.defineProperty方法使数据去通知相应watch，改变dom结构。vue2.0引入了虚拟dom，只通知到组件，提升了颗粒度。
便于diff算法的更新，key的唯一性，能让算法更快的找到需要更新的dom，需要注意的是，key要唯一，不然会出现很隐蔽性的更新问题。
18、 vue中怎么重置data？
Object.assign(this.$data, this.$options.data())
Object.assign（）方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象
this.$data获取当前状态下的data
this.$options.data()获取该组件初始状态下的data。
Object.assign(this.$data, this.$options.data())
设置comments属性，官网默认为舍弃注释
<template comments>
<!--我是注释内容-->
</template>
<script>
export default {
comments: true;
}
</script>
vue2.6发布一个新的API，可以处理一些简单的跨组件共享数据状态的问题。类轻量级vuex，用作状态管理
让一个对象可响应。Vue 内部会用它来处理 data 函数返回的对象。
返回的对象可以直接用于渲染函数和计算属性内，并且会在发生改变时触发相应的更新；也可以作为最小化的跨组件状态存储器。
用途：防止全局同名CSS污染
原理：在标签加上v-data-something属性，再在选择器时加上对应[v-data-something]，即CSS带属性选择器，以此完成类似作用域的选择方式
1、很多时候使用ui框架如果加scope就不能覆盖，这个时候一般写sass 会在最外层包裹该组件名的id 就可以不使用scoped 了
2、用/deep/也可以对组件内的样式进行覆盖
23、 vue边界情况有哪些？
访问根实例、访问父组件、子组件
vue中如果父组件想调用子组件的方法，可以在子组件中加上ref，然后通过this.$refs.ref.method调用
Vue中子组件调用父组件的方法，这里有三种方法提供参考：
1：直接在子组件中通过this.$parent.event来调用父组件的方法
2：在子组件里用$emit向父组件触发一个事件，父组件监听这个事件
3：父组件把方法传入子组件中，在子组件里直接调用这个方法
详细：（https://www.cnblogs.com/jin-zhe/p/9523782.html）
因为箭头函数默绑定父级作用域的上下文，所以不会绑定vue实例，所以 this 是undefind
26、 在vue项目中如果methods的方法用箭头函数定义结果会怎么样？
因为箭头函数默绑定父级作用域的上下文，所以不会绑定vue实例，所以 this 是undefind
1、将 favicon 图片放到 static 文件夹下
2、用 vue-cli 搭建的Vue项目。
3、然后在 index.html 中添加：
<link rel="shortcut icon" type="image/x-icon" href="static/favicon.ico">
4、刷新浏览器页面。
推荐在index.html中引入，不建议在配置文件中配置，成本太高,在vue.config.js中的pwa字段配置favicon路径等相关设置
28、你有使用过babel-polyfill模块吗？主要是用来做什么的？
babel默认只转换语法,而不转换新的API,如需使用新的API,还需要使用对应的转换插件或者polyfill去模拟这些新特性。
分为errorCaptured与errorHandler
errorCaptured是组件内部钩子，可捕捉本组件与子孙组件抛出的错误，接收error、vm、info三个参数，return false后可以阻止错误继续向上抛出。
errorHandler为全局钩子，使用Vue.config.errorHandler配置，接收参数与errorCaptured一致，2.6后可捕捉v-on与promise链的错误，可用于统一错误处理与错误兜底。
30、在vue事件中传入$event，使用e.target和e.currentTarget有什么区别？
currentTarget：事件绑定的元素
target:鼠标触发的元素
currentTarget 始终是监听事件者，而 target 是事件的真正发出者
31、 在.vue文件中style是必须的吗？那script是必须的吗？为什么？
试验了下，在 .vue 文件中，template是必须的，而script与style都不是必须的。
如果没有 template，则 [Vue warn]: Failed to mount component: template or render function not defined.
32、 vue怎么实现强制刷新组件？
强制重新渲染
this.$forceUpdate()
强制重新刷新某组件
//模版上绑定key
<SomeComponent :key="theKey"/>
//选项里绑定data
data(){
return{
theKey:0
}
}
//刷新key达到刷新组件的目的
theKey++;
this.$emit("eventName",data)
data为一个对象
两种方式
1、组件外部加修饰符.navtive
2、组件内部声明$emit('自定义事件')
36、 vue的属性名称与method的方法名称一样时会发生什么问题？
报warn，项目可以运行(vue2.5.17)
但data属性会覆盖methods定义的值，报属性已定义警告
props不会覆盖值，但会报属性已定义警告和Prop异常警告
37、 vue变量名如果以_、$开头的属性会发生什么问题？怎么访问到它们的值？
报错 变量未定义
以 _ 或 $ 开头的属性 不会 被 Vue 实例代理，
因为它们可能和 Vue 内置的属性、API 方法冲突。
你可以使用例如 $data.xxx或者_data.xxx 的方式访问这些属性。
38、 vue使用v-for遍历对象时，是按什么顺序遍历的？如何保证顺序？
在遍历对象时，会按 Object.keys() 的结果遍历，
但是不能保证它的结果在不同的 JavaScript 引擎下都一致。
使用Vue.extend直接扩展
使用Vue.mixin全局混入
HOC封装
加slot扩展
组件传值，祖孙组件有跨度的传值。
41、 分析下vue项目本地开发完成后部署到服务器后报404是什么原因呢？
1.检查nginx配置，是否正确设置了资源映射条件；
2.检查vue.config.js中是否配置了publicPath，若有则检查是否和项目资源文件在服务器摆放位置一致。
42、 v-once的使用场景有哪些？
表单提交。可防止用户在请求未及时响应时，多次提交~
input标签v-model用lazy修饰之后，vue并不会立即监听input
Value的改变，会在input失去焦点之后，才会触发input Value的改变
因为"树"状数据结构，肯定要有个"根"，一个遍历起始点
通过这个‘根节点’，来递归遍历整个vue‘树’下的所有节点，并处理为vdom，最后再渲染成真正的HTML，插入在正确的位置
45、EventBus注册在全局上时，路由切换时会重复触发事件，如何解决呢？
在组件销毁前 $off
47、 你有使用做过vue与原生app交互吗？说说vue与app交互的方法
jsBridge,建立连接，然后相互调用
48、 使用vue写一个tab切换
v-for循环，利用下标和v-show显示
作用域插槽+子组件
用过组件的name属性，调用自身。例如生成树型菜单
1、this.$refs：在子组件标签上加 ref属性如ref="baseAlert"，在父组件通过this.$refs.baseAlert.子组件方法名。
2、this.$children
this.$parent
1、this.$root
2、无限循环调用$parent直到没有这个属性为止
53、 说说你对Object.defineProperty的理解
Object.defineProperty定义新属性或修改原有的属性；
vue的数据双向绑定的原理就是用的Object.defineProperty这个
方法，里面定义了setter和getter方法，通过观察者模式（发布订阅模式）
来监听数据的变化，从而做相应的逻辑处理。
54、 vue组件里写的原生addEventListeners监听事件，要手动去销毁吗？为什么？
肯定要，一方面是绑定多次，另一方面是函数没释放会内存溢出
55、 vue组件里的定时器要怎么销毁？
当生命周期销毁后，并没有将组件中的计时器销毁，虽然页面上看不出来，但是如果在控制台打印的话，会发现计时器还在运行，所以要销毁计时器，避免代码一直执行
const timer = setInterval(() =>{
// 某些定时器操作
}, 500);
// 通过$once来监听定时器，在beforeDestroy钩子可以被清除。
this.$once('hook:beforeDestroy', () => {
clearInterval(timer);
})
56、 vue组件会在什么时候下被销毁？
v-if=‘false‘
没有使用keep-alive时的路由切换
路由跳转的时候
57、 使用vue渲染大量数据时应该怎么优化？说下你的思路！
1.如果需要响应式，考虑使用虚表（只渲染要显示的数据）；
2.如果不考虑响应式，变量在beforeCreated或created中声明（Object.freeze会导致列表无法增加数据）
vue中methods中函数尽量不要使用箭头函数，会改变this指向，在vue-cli构建的项目中this会为undefined
jsx不是一门新的语言，是一种新的语法糖。让我们在js中可以
编写像html一样的代码。允许XML语法直接加入到JavaScript
代码中，让你能够高效的通过代码而不是模板来定义界面
60、 说说组件的命名规范
定义组件名有两种方式：
1.kebab-case（短横线分隔命名），引用时必须也采用kebab-case；
2.PascalCase（首字母大写命名），引用时既可以采用PascalCase也可以使用kebab-case；
但在DOM中使用只有kebab-case是有效的
61、 怎么配置使vue2.0+支持TypeScript写法？
62、 <template></template>有什么用？
当做一个不可见的包裹元素，减少不必要的DOM元素，整个结构会更加清晰。
分组的条件判断和列表渲染
vue中is的属性引入是为了解决dom结构中对放入html的元素有限制的问题
<ul>
<li is='my-component'></li>
</ul>
:class 绑定变量 绑定对象 绑定一个数组 绑定三元表达式
:style 绑定变量 绑定对象 绑定函数返回值 绑定三元表达式
65、 你了解什么是函数式组件吗？
函数式组件：
需要提供一个render方法， 接受一个参数（createElement函数）， 方法内根据业务逻辑，通过createElement创建vnodes，最后return vnodes
createElement函数， 三个参数， 第一个参数是html标签或自定义组件，第二个参数一个obj（包含props， on...等等）， 第三个参数children(通过createElement构建， 或者字符串)
66、 vue怎么改变插入模板的分隔符？
delimiters
67、 组件中写name选项有什么作用？
1、项目使用keep-alive时，可搭配组件name进行缓存过滤
2、DOM做递归组件时需要调用自身name
3、vue-devtools调试工具里显示的组见名称是由vue中组件name决定的
通过在父组件中inject一些数据然后再所有子组件中都可以通过provide获取使用该参数,
主要是为了解决一些循环组件比如tree, menu, list等, 传参困难, 并且难以管理的问题, 主要用于组件封装, 常见于一些ui组件库
大力协助vue项目开发，看组件，参数，传值等，尤其是用的vuex的时候，用于调试vue应用，这可以极大地提高我们的调试效率
70、 说说你对slot的理解有多少？slot使用场景有哪些？
slot, 插槽, 在使用组件的时候, 在组建内部插入东西.
组件封装的时候最常使用到
props:{
title:String,
likes: Number,
isPublished: Boolean,
commentIds: Array,
author: Object,
callback: Function,
contactsPromise: Promise
}
单个类型就用Number等基础类型，多个类型用数组，必填的话
设置require为true，默认值的话设置default，对象和数组设置默认用工厂函数，
自定义验证函数validator。
74、 怎么缓存当前打开的路由组件，缓存后想更新当前组件怎么办呢？
可以在路由meta中加入参数, 对打开的路由进行keep-alive的判
断, 通过钩子active等
第一: 容错处理, 这个要做好, 极端场景要考虑到, 不能我传错了一个参数你就原地爆炸
第二: 缺省值(默认值)要有, 一般把应用较多的设为缺省值
第三: 颗粒化, 把组件拆分出来.
第四: 一切皆可配置, 如有必要, 组件里面使用中文标点符号, 还是英文的标点符号, 都要考虑到
第五: 场景化, 如一个dialog弹出, 还需要根据不同的状态封装成success, waring, 等
第六: 有详细的文档/注释和变更历史, 能查到来龙去脉, 新版本加了什么功能是因为什么
第七: 组件名称, 参数prop, emit, 名称设计要通俗易懂, 最好能做到代码即注释这种程度
第八: 可拓展性, 前期可能不需要这个功能, 但是后期可能会用上, 要预留什么, 要注意什么, 心里要有逼数
第九: 规范化,我这个input组件, 叫on-change, 我另外一个select组件叫change, 信不信老子捶死你
第十: 分阶段: 不是什么都要一期开发完成看具体业务, 如果一个select, 我只是个简单的select功能, 什么multi老子这个版本压根不需要, 别TM瞎折腾! 给自己加戏
76、 你了解vue的diff算法吗？
77、 vue如何优化首页的加载速度？
异步路由和异步加载
还有分屏加载, 按需加载, 延时加载图片等, cdn, 域名才分
不要什么东西动不动就打包到vendor中, 恶心
78、 vue打包成最终的文件有哪些？
vendor.js, app.js, app.css,
1.xxx.js
2.xxx.js
如果有设置到单独提取css的话
还有
1.xxx.css
默认的一个html文件，然后是js。css
ajax是最早出现发送后端请求的技术，属于原生js范畴,核心是使用XMLHttpRequest对象,使用较多并有先后顺序的话，容易产生回调地狱。
fetch号称可以代替ajax的技术，是基于es6中的Promise对象设计的，参数和jQuery中的ajax类似，它并不是对ajax进一步封装，它属于原生js范畴。没有使用XMLHttpRequest对象。
axios不是原生js,使用时需要对其进行安装，客户端和服务器端都可以使用，可以在请求和相应阶段进行拦截，基于promise对象
80、 vue能监听到数组变化的方法有哪些？为什么这些方法能监听到呢？
push()
pop()
shift()
unshift()
splice()
sort()
reverse()
[@click](https://github.com/click)=“func” 默认第一个参数传入event对象
[@click](https://github.com/click)="func(0, $event)" 如果自己需要传入参数和event对象，则需要使用$event来获取event对象并传入func
1.打包后文件引用路径不对，导致找不到文件报错白屏
2.路由模式mode设置影响
3.加载缓慢，出现短暂白屏
单向数据流：所有状态的改变可记录、可跟踪，源头易追溯；所有数据只有一份，组件数据只有唯一的入口和出口，使得程序更直观更容易理解，有利于应用的可维护性；一旦数据变化，就去更新页面(data-页面)，但是没有(页面-data)；如果用户在页面上做了变动，那么就手动收集起来(双向是自动)，合并到原有的数据中。
双向数据流：无论数据改变，或是用户操作，都能带来互相的变动，自动更新。
vant，mint等等吧，各有各的坑，不过大部分都是可以查到解决方案的
v-cloak指令只是在标签中加入一个v-cloak自定义属性，在HTML还编译完成之后该属性会被删除。
v-pre可以用来阻止预编译，有v-pre指令的标签内部的内容不会被编译，会原样输出。
事件修饰符.stop .prevent .capture .self .once .passive
表单修饰符.number .lazy .trim
88、 说说你对proxy的理解
目前只知道用来修改 属性的get set方法 vue3 来替换Object.defineProperty。一方面提高性能 另一方面可以免去给数组重写方法。
vue的数据劫持有两个缺点:
1、无法监听通过索引修改数组的值的变化
2、无法监听object也就是对象的值的变化
所以vue2.x中才会有$set属性的存在
proxy是es6中推出的新api，可以弥补以上两个缺点，所以vue3.x版本用proxy替换object.defineproperty
90、 用vue怎么实现一个换肤的功能？
这个……全局的theme属性然后做class判断或者加载不同的样式文件。一种是编译时换肤 一种是用户操作换肤。编译时换肤可以通过css in js相关技术修改css预处理器的变量 。用户操作换肤 只能内置一些styleb变量供用户选择了
91、 有在vue中使用过echarts吗？踩过哪些坑？如何解决的？
多注意dom的渲染时机 和chart的实例化时机 在相应的生命周期方法中做操作。结合强制刷新 应该就能解决大部分问题
92、 如果让你教一个2-3年经验前端经验的同事使用vue，你该怎么教？
93、 vue性能的优化的方法有哪些？
94、 SSR解决了什么问题？有做过SSR吗？你是怎么做的？
SSR服务端渲染，解决SEO问题，用next吧，最佳实践
优化首屏加载速度
95、 说说你觉得认为的vue开发规范有哪些？
https://juejin.im/post/5b67e49551882508603d1431
router 是不是hash 是否需要配置nginx , publicPath , 是不是要配置cdn
97、 vue过渡动画实现的方式有哪些？
1.使用vue的transition标签结合css样式完成动画
2.利用animate.css结合transition实现动画
3.利用vue中的钩子函数实现动画
98、 vue在created和mounted这两个生命周期中请求数据有什么区别呢？
看实际情况，一般在 created（或beforeRouter） 里面就可以，如果涉及到需要页面加载完成之后的话就用 mounted。
在created的时候，视图中的html并没有渲染出来，所以此时如果直接去操作html的dom节点，一定找不到相关的元素
而在mounted中，由于此时html已经渲染出来了，所以可以直接操作dom节点，（此时document.getelementById 即可生效了）
1.利用对象的引用关系来实现
2.父子组件之间的数据传递
3.使用.sync修饰符
100、 vue怎么获取DOM节点？
view：v-ref:xxx
data：this.$ref.xxx 这样就ok啦
101、 vue项目有做过单元测试吗？
102、 vue项目有使用过npm run build --report吗？
给 process.env 对象添加了一个属性 npm_config_report: "true"，
表示开启编译完成后的报告
1、在webpack.base.conf.js新增externals配置，表示不需要打
包的文件，然后在index.html中通过CDN引入
externals: {
"vue": "Vue",
"vue-router": "VueRouter",
"vuex": "Vuex",
"element-ui": "ELEMENT",
"BMap": "BMap"
}
2、使用路由懒加载 [官网]
(https://router.vuejs.org/zh/guide/advanced/lazy-loading.html)
105、 vue在开发过程中要同时跟N个不同的后端人员联调接口（请求的url不一样）时你该怎么办？
devServer中把所有的服务人员的地址代理都写进去，
然后动态更改接口的baseUrl，这样切换不同后端人员的时候不用重启
106、 vue要做权限管理该怎么做？如果控制到按钮级别的权限怎么做？
可以通过指令去做
Vue.directive('hasPermission', {
bind(el, binding, vnode) {
const permissions = vnode.context.$store.state.account.permissions
if (binding.value === '') return
const value = binding.value.split(',')
let flag = true
for (const v of value) {
if (!permissions.includes(v)) {
flag = false
}
}
if (!flag) {
if (!el.parentNode) {
el.style.display = 'none'
} else {
el.parentNode.removeChild(el)
}
}
}
}
107、 说下你的vue项目的目录结构，如果是大型项目你该怎么划分结构和划分组件呢？
views目录存放一级路由的组件，即视图组件
Components目录存放组件
Store存放vuex相关文件
Router目录存放路由相关文件
Untils目录存放工具js文件
API目录存放封装好的与后端交互的逻辑
Assets存放静态文件
108、在移动端使用vue，你觉得最佳实践有哪些？
vant 有赞的 感觉不错
Vue.js是一个轻巧、高性能、可组件化的MVVM库，同时拥有非
常容易上手的API；vue是单页面应用，使页面局部刷新，不用
每次跳转页面都要请求所有数据和dom，这样大大加快了访问
速度和提升用户体验。而且他的第三方ui库很多节省开发时间。
111、 vue开发过程中你有使用什么辅助工具吗？
vue-devtools
112、 vue和微信小程序写法上有什么区别？
113、 怎么缓存当前的组件？缓存后怎么更新？
keep-alive
通过actived钩子
115、 为什么我们写组件的时候可以写在.vue里呢？可以是别的文件名后缀吗？
配合相应的loader 想咋写就咋写
解析和转换 .vue 文件，提取出其中的逻辑代码 script、样式代
码 style、以及 HTML 模版 template，再分别把它们交给对应的
Loader 去处理。
117、说说你对vue的extend（构造器）的理解，它主要是用来做什么的？
构建一个组件和vue.components注册组件一起使用
119、如何将axios异步请求同步化处理？
async ,await
Generator函数
回调里面写回调
async getHistoryData (data) {
try {
let res = await axios.get('/api/survey/list/', {
params: data
})
this.tableData = res.data.result
this.totalData = res.data.count
} catch (err) {
console.log(err)
alert('请求出错！')
}
}
}
120、 怎么捕获组件vue的错误信息？
errorCaptured
121、 为什么vue使用异步更新组件？
批量更新 收集当前的改动一次性更新 节省diff开销
createElement,render
虚拟Dom在vue底层实现中是一个类，每次_render的时候都会
实例化Vnode为一个虚拟dom对象。也就是说本质上是用一个js
对象来描述dom节点。
123、 写出多种定义组件模板的方法
1、字符串
2、模板字面量
3、<script type="x-template"></script>
4、文件组件模板
5、inline-template
124、 SPA单页面的实现方式有哪些？
1.监听地址栏中hash变化驱动界面变化
2.用pushsate记录浏览器的历史，驱动界面发送变化
3.直接在界面用普通事件驱动界面变化
它们都是遵循同一种原则：div 的显示与隐藏
125、 说说你对SPA单页面的理解，它的优缺点分别是什么？
介绍：SPA应用就是一个web应用，可理解为：是一种只需要将单个页面加载到服务器之中的web应用程序。当浏览器向服务器发出第一个请求时，服务器会返回一个index.html文件，它所需的js，css等会在显示时统一加载，部分页面需要时加载。
优点：
1.良好的交互式体验。意思是：用户无需刷新页面，获取数据通过异步ajax获取，页面显示流畅
2.良好的前后端分离模式（MVVM），减轻服务端压力。服务器只需要输出数据就可以，不用管逻辑和页面展示，吞吐能力会提高几倍
3.共用同一套后端程序代码，不用修改就可用于web界面，手机和平板等客户端设备
缺点：
1.不利于SEO优化
2.由于单页应用在一个页面中显示，所以不可以使用浏览器自带的前进后退功能，想要实现页面切换需要自己进行管理
3.首屏加载过慢（初次加载耗时多），原因是：为了实现单页web应用功能及展示效果，在页面初始化的时候就会将js，css等统一加载，部分页面在需要时加载。当然也有解决方法。
解决方法：①使用路由懒加载 ②开启Gzip压缩 ③使用webpack的externals属性把不需要的库文件分离出去，减少打包后文件的大小 ④使用vue的服务端渲染（SSR）
举例spa应用：网易云音乐、QQ音乐等
126、 说说你都用vue做过哪些类型的项目？
127、 在vue项目中如何引入第三方库（比如jQuery）？有哪些方法可以做到？
1、绝对路径直接引入
在index.html中用script引入
<script src="./static/jquery-1.12.4.js"></script>
然后在webpack中配置external
externals: { 'jquery': 'jQuery' }
在组件中使用时import
import $ from 'jquery'
2 、在webpack中配置alias
resolve: { extensions: ['.js', '.vue', '.json'], alias: { '@': resolve('src'), 'jquery': resolve('static/jquery-1.12.4.js') } }
然后在组件中import
3、在webpack中配置plugins
plugins: [ new webpack.ProvidePlugin({ $: 'jquery' }) ]
全局使用，但在使用eslint情况下会报错，需要在使用了 $ 的代码前添加 /* eslint-disable*/ 来去掉 ESLint 的检查。
128、 使用vue手写一个过滤器
价格格式 日期格式
全局过滤器
Vue.filter('addHobby',(val,hobby)=>{
return val + hobby
})
局部过滤器
filters:{
addHobby(val,hobby){
return val + hobby
}
}
template也会翻译成render，只有一点，template中元素的
tag_name是静态的，不可变化，使用createEelment可以生
成不同tag_name, 比如h1 ... h6, 可以通过一个number变量
控制
130、 写出你常用的指令有哪些？
@ : v-once v-pre v-clock v-for v-html v-text v-model
131、 手写一个自定义指令及写出如何调用
全局自定义指令
Vue,directive('test',(el,binding,vnode)=>{
业务逻辑
})
局部指令
directives:{
test(el,binding,vnode){
业务逻辑
}
}
调用，都是v-test
一般在created 因为在这个生命周期我们常用到的都已经初始化好了
如果涉及dom 那就mounted
133、 你有用过事件总线(EventBus)吗？说说你的理解
也是组件传值的一种方式（例如兄弟组件）
134、 说说vue的优缺点分别是什么？
135、 DOM渲染在哪个周期中就已经完成了？
mounted生命周期
136、 第一次加载页面时会触发哪几个钩子？
beforeCreate, created, beforeMount, mounted
137、 vue生命周期总共有几个阶段？
138、 vue生命周期的作用是什么？
准确地控制数据流和其对DOM的影响
139、 vue和angular有什么区别呢？
140、 如何引入scss？引入后如何使用？
安装scss依赖包：
npm install sass-loader --save-dev npm install node-sass --save-dev
在build文件夹下修改 webpack.base.conf.js 文件：
在 module 下的 rules 里添加配置，如下：
{ test: /\.scss$/, loaders: ['style', 'css', 'sass'] }
应用：
在vue文件中应用scss时，需要在style样式标签上添加lang="scss"，即<style lang="scss">。
141、 使用vue开发过程你是怎么做接口管理的？
142、 为何官方推荐使用axios而不用vue-resource？
145、 如何中断axios的请求？
146、 axios是什么？怎样使用它？怎么解决跨域的问题？
148、 v-on可以绑定多个方法吗？
149、 vue常用的修饰符有哪些？列举并说明
150、 你认为vue的核心是什么？
151、 v-model是什么？有什么用呢？
152、 说说你对vue的mixin的理解，有什么应用场景？
153、 SPA首屏加载速度慢的怎么解决？
154、 删除数组用delete和Vue.delete有什么区别？
155、 动态给vue的data添加一个新的属性时会发生什么？怎样解决？
对象类型写法
this.$set("要给哪个对象添加","添加的对象的key",'添加的对象的value')
数组类型写法
this.$set('你要修改的数据'，'你要修改这个数组的索引值'，要修改的值val)
156、 组件和插件有什么区别？
组件 (Component) 是用来构成你的 App 的业务模块，它的目标是 App.vue。
插件 (Plugin) 是用来增强你的技术栈的功能模块，它的目标是 Vue 本身。
157、 说说你使用vue过程中遇到的问题（坑）有哪些，你是怎么解决的？
158、 说说你对选项el,template,render的理解
159、 vue实例挂载的过程是什么？
160、 vue在组件中引入插件的方法有哪些？
161、 v-if和v-for的优先级是什么？如果这两个同时出现时，那应该怎么优化才能得到更好的性能？
163、 分别说说vue能监听到数组或对象变化的场景，还有哪些场景是监听不到的？无法监听时有什么解决方案？
164、 $nextTick有什么作用？
console.log(this.$refs.message) // old dom
this.$nextTick()
.then(() => {
console.log(this.$refs.message) // new dom
})
165、 为什么data属性必须声明为返回一个初始数据对应的函数呢？
166、 怎么在watch监听开始之后立即被调用？
vm.$watch('a', callback, {
immediate: true
})
// 立即以 `a` 的当前值触发回调
167、 watch怎么深度监听对象变化？
168、 watch和计算属性有什么区别？
169、 vue如何监听键盘事件？
170、 v-for循环中key有什么作用？
171、 怎么在vue中使用插件？
172、 你有写过自定义组件吗？
174、 怎么使css样式只在当前组件中生效？
175、 你有看过vue的源码吗？如果有那就说说看
176、 你有写过自定义指令吗？自定义指令的生命周期（钩子函数）有哪些？
177、 v-show和v-if有什么区别？使用场景分别是什么？
178、 说说你对MVC、MVP、MVVM模式的理解
179、 说下你对指令的理解？
180、 请描述下vue的生命周期是什么？
181、 vue组件之间的通信都有哪些？
父子Coms: 1/2/3 ..
兄弟Coms: 4/5
跨级Coms: 4/5/6/7
1.props
2.$emit/$on
3.( $parents/$children ) / $refs
4.Vuex
5.Bus
6.( provide/inject )
7.( $attrs/$listeners )
182、 什么是虚拟DOM？
183、 什么是双向绑定？原理是什么？
185、 说说vue的优缺点
这个感觉和对vue的理解是差不多的题
优点：
1. 数据驱动
2.模块化
3.轻量级
4.SPA
5. 版本3.0的界面化管理工具比较好使
6.vue易入门
7.中文社区强大
缺点：
0. 不支持低版本浏览器,不支持IE8以下浏览器
1.吃内存（每个组件都会实例化一个Vue实例，实例的属性和方法很多）
2.定义在data里面的对象，实例化时，都会递归的遍历转成响应式数据，然而有的响应式数据我们并不会用到，造成性能上的浪费
3.像keep-alive transition transition-group 这些内置组件，不管用不用其实都已经挂到Vue.options.components上，如果不用，造成对象变大，从而占用内存
4.父子组件更新，没有明确的来源
186、 有使用过vue吗？说说你对vue的理解
vue-cli
3、 在使用vue-cli开发vue项目时，自动刷新页面的原理你了解吗？
自动刷新页面并不是vue-cli的功能，而是webpack的
hot-module-replacement-plugin插件在做这件事，这个插件是
webpack自带的插件，用来做hmr的。如果需要配置hmr只
需要在webpack.config.js的devServer字段写 下面的配置即
可。
{
contentBase: 服务器可以访问的根目录,
hot:true, //开启热模块替换也就是hmr
hotOnly:true //不刷新页面，只做hmr
}
而由于vue-cli3集成了webpack的配置，
所以vue.config.js里面也有这个属性，配置写法是一样的。
4、 vue-cli3插件有写过吗？怎么写一个代码生成插件？
MyPlugin.install = function (Vue, options) {
// 1. 添加全局方法或属性
Vue.myGlobalMethod = function () {
// 逻辑...
}
// 2. 添加全局资源
Vue.directive('my-directive', {
bind (el, binding, vnode, oldVnode) {
// 逻辑...
}
...
})
// 3. 注入组件选项
Vue.mixin({
created: function () {
// 逻辑...
}
...
})
// 4. 添加实例方法
Vue.prototype.$myMethod = function (methodOptions) {
// 逻辑...
}
}
5、 vue-cli生成的项目可以使用es6、es7的语法吗？为什么？
首先说结论, 有些可以直接使用, 有些不行
根据vue-cli 3.0的配置, 如果webpack能检测到, 它会自动把
垫片自动打包到vendor中, 但是有些特性它检测不出来, 如es6.promise, 等
vue-cli 配置了babel,可以将es6,es7....etc在webpack打包的
时候转换成es5的代码，所以上线的时候没有问题。但是脚
手架只是配置了一些默认常见的用法， 可以根据babel官网
配置一些尚在草案中的语法
8、 你知道什么是脚手架吗？
9、 说下你了解的vue-cli原理？你可以自己实现个类vue-cli吗？
11、 vue-cli3你有使用过吗？它和2.x版本有什么区别？
12、 vue-cli默认是单页面的，那要弄成多页面该怎么办呢？
13、 不用vue-cli，你自己有搭建过vue的开发环境吗？流程是什么？
vue-router
方法一：在routes:[{
{ path: '/a', redirect: '/b' }
}]
方法二：别名
routes: [
{ path: '/a', component: A, alias: '/b' }
]
5、 vue-router有哪几种导航钩子（ 导航守卫 ）？
9、 切换到新路由时，页面要滚动到顶部或保持原先的滚动位置怎么做呢？
10、 在什么场景下会用到嵌套路由？
11、 如何获取路由传过来的参数？
如果使用query方式传入的参数使用this.$route.query 接收
如果使用params方式传入的参数使用this.$router.params接收
14、 vur-router怎么重定向？
15、 怎样动态加载路由？
16、 怎么实现路由懒加载呢？
为了方便后期维护，建议独立出一个 router.js 文件
npm install vue-router
引入注册
import Router from 'vue-router';
Vue.user(Router);
向外暴露出一个router实例
export default new Router({
mode: '',
path: '',
name: '',
...
});
20、 如果vue-router使用history模式，部署时要注意什么？
vuex
1、 你有写过vuex中store的插件吗？
2、 你有使用过vuex的module吗？主要是在什么场景下使用？
3、 vuex中actions和mutations有什么区别？
7、 vuex怎么知道state是通过mutation修改还是外部直接修改的？
8、 请求数据是写在组件的methods中还是在vuex的action中？
10、 vuex的action和mutation的特性是什么？有什么区别？
12、 vuex的state、getter、mutation、action、module特性分别是什么？
state, 状态初始化, 并实施观察
getter, 获取数据用于view或data中使用
mutation: 内部处理state变化
action: 处理外部交互
module: 模块化以上四个
13、 vuex的store有几个属性值？分别讲讲它们的作用是什么？
14、 你理解的vuex是什么呢？哪些场景会用到？不用会有问题吗？有哪些特性？
15、 使用vuex的优势是什么？
16、 有用过vuex吗？它主要解决的是什么问题？推荐在哪些场景用？
ElementUI
1、 ElementUI是怎么做表单验证的？在循环里对每个input验证怎么做呢？
model 绑定表单数据 通过prop 取表单数值，根据rule取form-item rules 或则rules[prop]校验
2、 你有二次封装过ElementUI组件吗？
4、 ElementUI的穿梭组件如果数据量大会变卡怎么解决不卡的问题呢？
6、 ElementUI使用表格组件时有遇到过问题吗？
7、 有阅读过ElementUI的源码吗？
8、 项目中有使用过ElementUI吗？有遇到过哪些问题？它的使用场景主要是哪些？
mint-ui
1、 mint-ui使用过程中有没有遇到什么坑？怎么解决的？
