1. vue slot
答：简单来说，假如父组件需要在子组件内放一些 DOM ，那么这些 DOM 是显示、不显示、
在哪个地方显示、如何显示，就是 slot 分发负责的活。
2. 你们 vue 项目是打包了一个 js 文件，一个 css 文件，还是有多个文件？
答：根据 vue-cli 脚手架规范，一个 js 文件，一个 CSS 文件。
3.Vue 里面 router-link 在电脑上有用，在安卓上没反应怎么解决？
答： Vue 路由在 Android 机上有问题， babel 问题，安装 babel polypill 插件解决。
4.Vue2 中注册在 router-link 上事件无效解决方法
答：使用 @click.native 。原因： router-link 会阻止 click 事件， .native 指直接监听一
个原生事件。
5.RouterLink 在 IE 和 Firefox 中不起作用（路由不跳转）的问题
答 : 方法一：只用 a 标签，不适用 button 标签；方法二：使用 button 标签和 Router.navigate
方法
6.axios 的特点有哪些
答：
从浏览器中创建 XMLHttpRequests ；
node.js 创建 http 请求；
支持 Promise API ；
拦截请求和响应；
转换请求数据和响应数据；
取消请求；
自动换成 json 。
axios 中的发送字段的参数是 data 跟 params 两个，两者的区别在于 params 是跟请求地址
一起发送的， data 的作为一个请求体进行发送 params 一般适用于 get 请求， data 一般适用于 post put 请求。
7. 请说下封装 vue 组件的过程？
答：
1. 建立组件的模板，先把架子搭起来，写写样式，考虑好组件的基本逻辑。 (os ：思考 1 小时，
码码 10 分钟，程序猿的准则。 )
2. 准备好组件的数据输入。即分析好逻辑，定好 props 里面的数据、类型。
3. 准备好组件的数据输出。即根据组件逻辑，做好要暴露出来的方法。
4. 封装完毕了，直接调用即可
8.params 和 query 的区别
答：用法： query 要用 path 来引入， params 要用 name 来引入，接收参数都是类似的，分
别是 this.$route.query.name 和 this.$route.params.name 。
url 地址显示：
query 更加类似于我们 ajax 中 get 传参， params 则类似于 post ，说的再简单一点，前者在
浏览器地址栏中显示参数，后者则不显示
注意点：
query 刷新不会丢失 query 里面的数据 params 刷新 会 丢失 params 里面的数据。
9.vue 初始化页面闪动问题
答：使用 vue 开发时，在 vue 初始化之前，由于 div 是不归 vue 管的，所以我们写的代
码在还没有解析的情况下会容易出现花屏现象，看到类似于 {{message}} 的字样，虽然
一般情况下这个时间很短暂，但是我们还是有必要让解决这个问题的。首先：在 css 里加上
[v-cloak] { display: none; } 。如果没有彻底解决问题，则在根元素加上
style="display: none;" :style="{display: block }"
10.vue 更新数组时触发视图更新的方法
答 :push() ； pop() ； shift() ； unshift() ； splice() ； sort() ； reverse()
11.vue 常用的 UI 组件库
答： Mint UI ， element ， VUX
12.vue 修改打包后静态资源路径的修改
答： cli2 版本：将 config/index.js 里的 assetsPublicPath 的值改为 ./ 。
build : {
// ...
assetsPublicPath : . / ,
// ...
}
复制 cli3 版本：在根目录下新建 vue.config.js 文件，然后加上以下内容：（如果已经有此文件
就直接修改）
module.exports = {
publicPath : , // 相对于 HTML 页面（目录相同）
}
复制
生命周期函数面试题篇
### 42. 什么是 vue 生命周期？有什么作用？
答：每个 Vue 实例在被创建时都要经过一系列的初始化过程 —— 例如，需要设置数据监听、
编译模板、将实例挂载到 DOM 并在数据变化时更新 DOM 等。同时在这个过程中也会运
行一些叫做 生命周期钩子 的函数，这给了用户在不同阶段添加自己的代码的机会。（ ps ：
生命周期钩子就是生命周期函数）例如，如果要通过某些插件操作 DOM 节点，如想在页面
渲染完后弹出广告窗， 那我们最早可在 mounted 中进行。
13. 第一次页面加载会触发哪几个钩子？
答： beforeCreate ， created ， beforeMount ， mounted
14. 简述每个周期具体适合哪些场景
答：
beforeCreate ： 在 new 一个 vue 实例后，只有一些默认的生命周期钩子和默认事件，其
他的东西都还没创建。在 beforeCreate 生命周期执行的时候， data 和 methods 中的数据都
还没有初始化。不能在这个阶段使用 data 中的数据和 methods 中的方法
create ： data 和 methods 都已经被初始化好了，如果要调用 methods 中的方法，或者
操作 data 中的数据，最早可以在这个阶段中操作
beforeMount ： 执行到这个钩子的时候，在内存中已经编译好了模板了，但是还没有挂载
到页面中，此时，页面还是旧的
mounted ： 执行到这个钩子的时候，就表示 Vue 实例已经初始化完成了。此时组件脱离了
创建阶段，进入到了运行阶段。如果我们想要通过插件操作页面上的 DOM 节点，最早可以
在和这个阶段中进行
beforeUpdate ： 当执行这个钩子时，页面中的显示的数据还是旧的， data 中的数据是更
新后的， 页面还没有和最新的数据保持同步
updated ： 页面显示的数据和 data 中的数据已经保持同步了，都是最新的
beforeDestory ： Vue 实例从运行阶段进入到了销毁阶段，这个时候上所有的 data 和
methods ， 指令， 过滤器 …… 都是处于可用状态。还没有真正被销毁
destroyed ： 这个时候上所有的 data 和 methods ， 指令， 过滤器 …… 都是处于不可
用状态。组件已经被销毁了。
15.created 和 mounted 的区别
答： created: 在模板渲染成 html 前调用，即通常初始化某些属性值，然后再渲染成视图。
mounted: 在模板渲染成 html 后调用，通常是初始化页面完成后，再对 html 的 dom 节点进
行一些需要的操作。
16.vue 获取数据在哪个周期函数
答：一般 created/beforeMount/mounted 皆可 . 比如如果你要操作 DOM , 那肯定
mounted 时候才能操作 .
17. 请详细说下你对 vue 生命周期的理解？
答：总共分为 8 个阶段创建前 / 后，载入前 / 后，更新前 / 后，销毁前 / 后。
创建前 / 后： 在 beforeCreated 阶段， vue 实例的挂载元素 $el 和 数据对象 data 都为
undefined ，还未初始化。在 created 阶段， vue 实例的数据对象 data 有了， $el 还没有。
载入前 / 后： 在 beforeMount 阶段， vue 实例的 $el 和 data 都初始化了，但还是挂载之
前为虚拟的 dom 节点， data.message 还未替换。在 mounted 阶段， vue 实例挂载完成，
data.message 成功渲染。
更新前 / 后： 当 data 变化时，会触发 beforeUpdate 和 updated 方法。
销毁前 / 后： 在执行 destroy 方法后，对 data 的改变不会再触发周期函数，说明此时 vue
实例已经解除了事件监听以及和 dom 的绑定，但是 dom 结构依然存在。
vue 路由面试题篇
18.mvvm 框架是什么？
答： vue 是实现了双向数据绑定的 mvvm 框架，当视图改变更新模型层，当模型层改变更新
视图层。在 vue 中，使用了双向绑定技术，就是 View 的变化能实时让 Model 发生变化，而
Model 的变化也能实时更新到 View 。
19.vue-router 是什么 ? 它有哪些组件
答： vue 用来写路由一个插件。 router-link 、 router-view
20.active-class 是哪个组件的属性？
答： vue-router 模块的 router-link 组件。 children 数组来定义子路由
21. 怎么定义 vue-router 的动态路由 ? 怎么获取传过来的值？
答：在 router 目录下的 index.js 文件中，对 path 属性加上 /:id 。使用 router 对象的 params.id 。
22.vue-router 有哪几种导航钩子 ?
答：三种，
第一种： 是全局导航钩子： router.beforeEach(to,from,next) ，作用：跳转前进行判断拦截。 第二种： 组件内的钩子
第三种： 单独路由独享组件
23. `$route` 和 `$router` 的区别
答： $router 是 VueRouter 的实例，在 script 标签中想要导航到不同的 URL, 使用
$router.push 方法。返回上一个历史 history 用 $router.to(-1)
$route 为当前 router 跳转对象。里面可以获取当前路由的 name,path,query,parmas 等。
24.vue-router 的两种模式
答 : hash 模式： 即地址栏 URL 中的 # 符号；
history 模式： window.history 对象打印出来可以看到里边提供的方法和记录长度。利用了
HTML5 History Interface 中新增的 pushState() 和 replaceState() 方法。（需要特定浏览
器支持）。
25.vue-router 实现路由懒加载（ 动态加载路由 ）
答 : 三种方式
第一种： vue 异步组件技术 ==== 异步加载， vue-router 配置路由 , 使用 vue 的异步组件
技术 , 可以实现按需加载 . 但是 , 这种情况下一个组件生成一个 js 文件。
第二种： 路由懒加载 ( 使用 import) 。
第三种： webpack 提供的 require.ensure() ， vue-router 配置路由，使用 webpack 的
require.ensure 技术，也可以实现按需加载。这种情况下，多个路由指定相同的 chunkName ，
会合并打包成一个 js 文件。
vuex 常见面试题篇
26.vuex 是什么？怎么使用？哪种功能场景使用它？
答： vue 框架中状态管理。在 main.js 引入 store ，注入。
新建了一个目录 store.js ， ….. export 。
场景有：单页应用中，组件之间的状态。音乐播放、登录状态、加入购物车
27.vuex 有哪几种属性？
答：有五种，分别是 State 、 Getter 、 Mutation 、 Action 、 Module
state => 基本数据 ( 数据源存放地 )
getters => 从基本数据派生出来的数据
mutations => 提交更改数据的方法，同步！
actions => 像一个装饰器，包裹 mutations ，使之可以异步。
modules => 模块化 Vuex
28.Vue.js 中 ajax 请求代码应该写在组件的 methods 中还是 vuex 的 actions 中？
答：如果请求来的数据是不是要被其他组件公用，仅仅在请求的组件内使用，就不需要放入
vuex 的 state 里。
如果被其他地方复用，这个很大几率上是需要的，如果需要，请将请求放入 action 里，方
便复用。
# 29. **说⼀下数组新增的⽅法有哪些**?**这些⽅法分别是什么意思**?(**必问**)
## Array.from⽅法 将类数组转化为真正的数组
## Array.of⽅法 将数值转化为数组
## copyWithin() **⽅法是将指定位置的成员复制到其他位置（会覆盖原有成员）**
## find⽅法和findindex⽅法 查找符合条件的元素。 查找符合条件元素的下表
## includes⽅法可以查看表个数组是否包含给定的值
## flat⽅法将多维数组转化为1维数组或者指定维度的数组
## 遍历的数组的⽅法:
## forEach 类似于for循环,主要是⽤来遍历数组
## map⽅法 主要作⽤是映射⼀个新的数组,可以对数组进⾏遍历
## filter⽅法 主要作⽤返回⼀个符合条件新的数据,同样也有遍历数组的作⽤
# **30.说⼀下**map**⽅法、**forEach**⽅法、**filter**⽅法的作⽤以及他们之间的区别**?(90%)
## forEach() **⽅法**: **循环原来的数组**
## map() **⽅法： 循环原数组并映射⼀个新数组出来**
## filter() **⽅法： 过滤不需要的数组元素**
# 31. **说⼀下**for in **与**for of**的区别**?(80%)
## For in可以遍历对象 ⽽ for of遍历对象会报错
## for in 遍历数组得到的数组的下表 ⽽for of遍历得到的时候数组⾥⾯的每⼀个元素
# 32. **说⼀下数组去重的⽅法有哪些**?es6**如何实现数组去重**?(90%)
## indexof
## 双层for循环
## set⽅法
# 33. **如何将多个数组合并成为⼀个数组**?(70%)
## es5 :
## concat
## for循环
## Es6:
## 扩展运算符
## map⽅法
# **36.说⼀下**forEach**、**map**、**filter**、**reduce**、**some**、**every**等⽅法的作⽤**?(50%)
## reduce 遍历数据求和。
## some 遍历数组每⼀项，有⼀项返回true,则停⽌遍历，结果返回true。不改变原数组
## 遍历数组每⼀项，每⼀项返回true,则最终结果为true。当任何⼀项返回false时，停⽌遍历，返回false。不改变原数组
## forEach() **⽅法**: **循环原来的数组**
## map() **⽅法： 循环原数组并映射⼀个新数组出来**
## filter() **⽅法： 过滤不需要的数组元素**
# 37. **实现数组去重**?**最少写出三种⽅法**?(70%)indexof
## set
## new Set(arr)
## 双层for循
# 38.**请说出实现冒泡排序的思路**?(40%)
## \39. ⽐较相邻的两个元素，如果前⼀个⽐后⼀个⼤，则交换位置。 2、⽐较完第⼀轮的时候，最后⼀个元素是最⼤的元素。 3、这时候最后⼀个元素是最⼤的，所以最后⼀个元素就不需要参与⽐较⼤⼩。
## \40. 双层for循环
## \41. 外层 条件判断使⽤数组⻓度 - 1
## \42. 内层是 - 1 - i
## \43. 相邻元素进⾏⽐较 ,然后再进⾏两两交换
# **44.判断数据类型的⽅式有哪些**?**每⼀个都有什么不同**?(50%)
## typeof 检测基本数据类型
## instanceof 检测引⽤数据类型,但是⽆法确定哪⼀个引⽤数据的实例
## Object.prototype.toString.call 检测引⽤数据类型
## isArray 检测是不是⼀个数组
# **45.如何改变函数内部的**this**指针的指向**?(60%)
## call apply bind
## 区别?
## call和apply改变了函数的this上下⽂后便执⾏该函数,⽽bind则是返回改变了上下⽂后的⼀个函数。
## 他们俩之间的差别在于参数的区别，call和apply的第⼀个参数都是要改变上下⽂的对象，⽽call从第⼆个参数开始以参数列表
## 的形式展现，apply则是把除了改变上下⽂对象的参数放在⼀个数组⾥⾯作为它的第⼆个参数。
# **46.说⼀下数组常⽤的⽅法有哪些**?(80%)
## push
## pop
## shi!
## unshi!
## splice
## concat
## sort
## substring
## substr
## slice
## reserve
# 47. js**的数据类型有哪些**?(30%)6中 分别基本数据类型 和 引⽤数据类型
## 基本数据类型: number string boolean undefined null
## 引⽤数据类型: object object 和 array function
## 用css画一个三角形
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
/* css3绘制三角形 */
.triangle{
width: 0px; /*设置宽高为0，所以div的内容为空，从才能形成三角形尖角*/
height: 0px;
border-bottom: 200px solid #00a3af;
border-left: 200px solid transparent; /*transparent 表示透明*/
border-right: 200px solid transparent;
}
</style>
</head>
<body>
<div class="triangle"></div>
</body>
</html>