注：答案均以红色字体标注！答案仅供参考！为提供学员的实操性! 此处答案均以截图提供！希望学员能以实操理解！
1，active-class 是哪个组件的属性？嵌套路由怎么定义？
答：vue-router 模块的 router-link 组件。
2，怎么定义 vue-router 的动态路由？怎么获取传过来的动态参数？
答：在路由的 path 属性上加上 【/:id】。获取：router.params.id。
3，vue-router 有哪几种导航钩子？
答：
(1)全局导航钩子：beforeEach()、afterEach()
(2)路由独享组件：beforeEnter()
(3)组件内的钩子：beforeRouteEnter()、beforeRouteUpdate()、beforeRouteLeave()
4，scss 是什么？使用步骤是？有那几大特性？
(1)预处理 css，把 css 当成函数编写，定义变量，嵌套
(2)npm 下三个 loader (sass-loader、css-loader、node-sass);
在 build 文件夹下 webpack.base.conf.js 文件，在module 中添加规则 { test: /.sass变量名称=值)；
5，mint-ui是什么？怎么使用？至少说出三个组件的使用方法？
答：
(1)基于 vue 的前端组件库。npm 安装，然后 import 样式和js，Vue.use(mintUI)全局引入。
(2)在单个组件内部引入：import { Toast } from ‘mint-ui’
(3)组件1：Toast(‘登录成功’)；
组件2：mint-header
组件3：mint-swiper
6，v-model 是什么？怎么使用？vue中标签怎么绑定事件？
答：是可以实现双向数据绑定的指令(v-class、v-for 、v-if、v-show、v-on)
7，axios 是什么？怎么使用？描述使用它实现登录功能的流程？
答：
(1)axios 是请求后台资源的模块
(2)npm install axios -S，然后 axios.get(‘/user’, {params: {ID: 123465}},then(res=> {}).catch(err=> {}))
8，axios + tp5 进阶中，调用 axios.post(‘api/user’)是进行什么操作？axios.put(‘api/user/8’)呢？
答：跨域，添加用户操作，更新操作
9，谈谈对vue 组件化的理解。
答：组件的基本构成分别为：样式结构，行为逻辑，数据。web 中的组件其实就是页面的一部分，每个组件都会提供一些对外的接口，允许使用者使用和设置参数属性，可以将不同功能的组件结合在一起，快速的构建一个符合需求的引用
10，谈谈对Vue 路由的理解。
答：首先Vue的单页面应用是基于路由和组件的，路由用于设定访问的路径，并将路径和组件映射起来。传统的页面应用，是通过超链接来实现页面的切换和跳转。在vue-router 中是路径之间的切换，也就是组件的切换。
11．谈谈你对 Vue 钩子函数的理解
答：vue-router 的导航钩子主要用于拦截导航，让他完成跳转或取消。
12，如何让 css 只在当前页面起作用
答：
13，created 和 mounted 的区别
答：created 是实例创建完成之后的钩子函数；el属性不可见Ϊundefinedmounted是将编译好的HTML挂在到ҳ面完成后ִ行的钩子函数，在整个生命周期中ִֻ行һ次，；el属性不可见Ϊundefinedmounted是将编译好的HTML挂在到ҳ面完成后ִ行的钩子函数，在整个生命周期中ִֻ行һ次，；el 已创建，同时 DOM 已生成。
14，created 和 mounted 分别什么时候用？
答：只有 ajax 数据请求时，使用 created ；如果有依赖DOM的情况，就放在 mounted中
15，vue 和 angular 分别采用什么技术实现双向数据绑定？
答：Angular 采用”脏值检测“的方式，数据发生变更后，对于所有的数据和视图的绑定关系击行一次检测，识别是否有数据发生变化，有变化进行处理，可能进一步引发其他数据变化，所以这个过程可能会重复几次，一直到没有数据发生变化后，将变更的数据发送到视图，更新页面展示。如果是手动对 ViewModel 的数据进行变更，为确保变更同步到试图，需要手动触发一次“脏值检测”。
VueJS 则使用 ES5 提供的 Object.defineProperty 方法，监控对数据的操作，从而可以自动触发数据同步。并且是在不同的数据上触发同步，可以精确的将变更发送给绑定的视图，而不是对所有数据都进行一次检测。
16.描述下 vue 从初始化页面–修改数据–刷新页面 UI 的过程？
答：当 Vue 进入初始化阶段时，一方面 Vue 会遍历 data 中的属性，并用 Object.defineProperty 将它转化成 getter/setter 的形式，实现数据劫持(暂不谈 Vue3.0 的 Proxy)；另一方面，Vue 的指令编译器 Compiler 对元素节点的各个指令进行解析，初始化视图，并订阅 Watcher 来更新试图，此时 Watcher 会将自己添加到消息订阅器 Dep 中，此时初始化完毕。
当数据发生变化时，触发 Observer 中 setter 方法，立即调用 Dep.notify(),Dep 这个数组开始遍历所有的订阅者，并调用其 update 方法，Vue 内部再通过 diff 算法，patch 相应的更新完成对订阅者视图的改变。
17. Vue中watch、methods 和 计算属性的区别是什么？
答：watch 为了监听某个响应数据的变化。计算属性是自动监听依赖值的变化，从而动态返回内容，主要目的是简化模板内的复杂运算。所以区别来源于用法，只是需要动态值，那就用计算属性；需要知道值的改变后执行业务逻辑，才用 watch。
methods是一个方法，它可以接受参数，而computed 不能，computed 是可以缓存的，methods 不会。computed 可以依赖其他 computed，甚至是其他组件的 data。
18.vue中怎么重置data
答：使用Object.assign()，vm.$data可以获取当前状态下的data，vm.$options.data可以获取到组件初始化状态下的data。
Object.assign(this.$data, this.$options.data())
19.Vue组件中写 name 选项有什么作用？
答：
项目使用 keep-alive 时，可搭配组件 name 进行缓存过滤
DOM 做递归组件时需要调用自身 name
vue-devtools 调试工具里显示的组见名称是由vue中组件name决定的
20.Vuex有哪几种属性
答：有五种，分别是State、Getter、Mutation、Action、Module
21.vue 的优点是什么？
答：低耦合。视图(View)可以独立于 Model 变化和修改，一个 ViewModel 可以绑定到不同的”View”上，当 View 变化的时候 Model 可以不变，当 Model 变化的时候 View 也可以不变。
可重用性。你可以把一些视图逻辑放在一个 ViewModel 里面，让很多 view 重用这段视图逻辑。
独立开发。开发人员可以专注于业务逻辑和数据的开发(ViewModel)，设计人员可以专注于页面设计，使用 Expression Blend 可以很容易设计界面并生成 xml 代码。
可测试。界面素来是比较难于测试的，而现在测试可以针对 ViewModel 来写。
22.说出至少 4 种 vue 当中的指令和它的用法
答：v-if(判断是否隐藏)、v-for(把数据遍历出来)、v-bind(绑定属性)、v-model(实现双向绑定)
23.vuex 的 store 特性是什么
答：vuex 就是一个仓库，仓库里放了很多对象。其中 state 就是数据源存放地，对应于一般 vue 对象里面的 datastate 里面存放的数据是响应式的，vue 组件从 store 读取数据，若是 store 中的数据发生改变，依赖这相数据的组件也会发生更新它通过 mapState 把全局的 state 和 getters 映射到当前组件的 computed 计算属性
24．vuex 的 getter 特性是什么
答：getter 可以对 state 进行计算操作，它就是 store 的计算属性虽然在组件内也可以做计算属性，但是 getters 可以在多给件之间复用如果一个状态只在一个组件内使用，是可以不用 getters
25.vuex 的 mutation 特性是什么
答：action 类似于 muation, 不同在于：action 提交的是 mutation,而不是直接变更状态action 可以包含任意异步操作
vue 中 ajax 请求代码应该写在组件的 methods 中还是 vuex 的 action 中
如果请求来的数据不是要被其他组件公用，仅仅在请求的组件内使用，就不需要放入 vuex 的 state 里如果被其他地方复用，请将请求放入 action 里，方便复用，并包装成 promise 返回
26. Vuex 如何区分 state 是外部直接修改，还是通过 mutation 方法修改的？美团
答：Vuex 中修改 state 的唯一渠道就是执行 commit(‘xx’, payload) 方法，其底层通过执行 this._withCommit(fn) 设置_committing 标志变量为 true，然后才能修改 state，修改完毕还需要还原_committing 变量。外部修改虽然能够直接修改 state，但是并没有修改_committing 标志位，所以只要 watch 一下 state，state change 时判断是否_committing 值为 true，即可判断修改的合法性。
27.不用 vuex 会带来什么问题
答：可维护性会下降，你要修改数据，你得维护 3 个地方
可读性下降，因为一个组件里的数据，你根本就看不出来是从哪里来的
增加耦合，大量的上传派发，会让耦合性大大的增加，本来 Vue 用 Component 就是为了减少耦合，现在这么用，和组件化的初衷相背
28. 1、v-show 与 v-if 区别
答：
1、v-show是css切换，v-if是完整的销毁和重新创建。
2、使用 频繁切换时用v-show，运行时较少改变时用v-if
3、v-if=‘false’ v-if是条件渲染，当false的时候不会渲染
29. Class 与 Style 如何动态绑定？
答：
Class
1、对象方法 v-bind:class=”{‘orange’: isRipe, ‘green’: isNotRipe}”
2、数组方法 v-bind:class=”[class1, class2]”<
3、行内 v-bind:style=”{color: color, fontSize: fontSize+’px’}”
Stlye
1、对象方法
30. 说说Vue中的事件修饰符。
答：
.native:绑定一个原生的click事件
.prevent: 提交时间不再重载页面
.stop:阻止单击事件冒泡
.self:当事件发生在该元素本身而不是子元素的时候触发
.capture:事件侦听，事件发生的时候会调用
组合键 click.ctrl.exact 只有ctrl被按下的时候才触发
除非注明，文章均由
转载请注明：
作者：Dotnet9
链接：
