vue核心面试题（零碎题）

一、在开发中，你将ajax请求放在哪个生命周期中

1.一般ajax请求可以放置的位置在created和mounted中。

2.在created的时候已经可以拿到数据，视图中的 dom 并没有渲染出来，所以此时如果直接去操 dom 节点，无法找到相关的元素。

3.在mounted中，由于此时 dom 已经渲染出来了，所以可以直接操作 dom 节点 。

4.一般情况下都放到 mounted 中，保证逻辑的统一性，因为很多时候我们的请求会操作dom，避免出现拿不到dom的情况，放的mounted中的情况下多。如果不涉及操作dom，提前请求做一次数据处理放在created中。在服务端渲染不支持mounted方法，所以在服务端渲染的情况下统一放到created中。

二、何时需要使用beforeDestroy

1.在当前页面使用了$on方法时，就需求在组件销毁前解绑。如果不解绑，一会在触发这件事情的时候，可能还会去操作实例，这时实例已经被销毁了，所以在销毁前解绑下。

2.清楚自己定义的定时器。

3.解绑一些原生事件。比如对scroll，mousemove，resize等添加的监听事件，在销毁前进行移除监听事件，提高性能，因为在销毁时不移除监听事件，会一直处于监听状态，浪费资源。

4.如果项目中使用了websocket时，在销毁前可以关闭websocket的连接，避免造成资料浪费。

5.其实在该组件销毁后，对无用数据无用操作都可以在beforeDestroy中进行清除和关闭。

三、vue中的特殊指令

  target._o = markOnce

  target._n = toNumber

  target._s = toString

  target._l = renderList

  target._t = renderSlot

  target._q = looseEqual

  target._i = looseIndexOf

  target._m = renderStatic

  target._f = resolveFilter

  target._k = checkKeyCodes

  target._b = bindObjectProps

  target._v = createTextVNode

  target._e = createEmptyVNode

  target._u = resolveScopedSlots

  target._g = bindObjectListeners

  target._d = bindDynamicKeys

  target._p = prependModifier

四、Vue3.0你知道有哪些改进?

1.vue3采用TS编写

2.采用了Composrtion API，解决了mixin的缺陷，代码的条理性

3.vue3中响应式数据原理改成了proxy，vue3只渲染动态数据的部分，vue2中会不停的去比对

4.vdom 的对比算法更新，只更新 vdom 的绑定了动态数据的部分

五、Vue-Router中导航守卫有哪些？

1、全局前置守卫： router.beforeEach

2、全局解析守卫： router.beforeResolve

3、全局后置钩子： router.afterEach

4、路由独享的守卫： beforeEnter

5、组件内的守卫： beforeRouteEnter、beforeRouteUpdate (2.2 新增)、beforeRouteLeave

执行顺序：beforeRouteLeave < beforeEach < beforeRouteUpdate < beforeEnter < beforeRouteEnter < beforeResolve < afterEach

六、完整的导航解析流程 (runQueue)

1. 导航被触发。

2. 在失活的组件里调用离开守卫。

3. 调用全局的 beforeEach 守卫。

4. 在重用的组件里调用 beforeRouteUpdate 守卫 (2.2+)。

5. 在路由配置里调用 beforeEnter 。

6. 解析异步路由组件。

7. 在被激活的组件里调用 beforeRouteEnter 。

8. 调用全局的 beforeResolve 守卫 (2.5+)。

9. 导航被确认。

10. 调用全局的 afterEach 钩子。

11. 触发 DOM 更新。

12. 用创建好的实例调用 beforeRouteEnter 守卫中传给 next 的回调函数。

七、action 和 mutation区别

1.mutation 是同步更新数据(内部会进行是否为异步方式更新数据的检测) $watch 严格模式下会报错

2.action 异步操作，可以获取数据后调佣 mutation 提交最终数据