前端面试之Vue

Posted 2021-09-14 seven

vue生命周期

1. beforeCreate:vue实例的挂载元素$el和数据对象data都为undefined，还未初始化
2. created:vue实例的数据对象data有了，$el还没有
3. beforeMount:vue实例的$el和data都初始化了，但还是挂载之前为虚拟的dom节点，data.message还未替换
4. mounted:vue实例挂载完成，data.message成功渲染
5. beforeUpdate:当data变化时，会触发beforeUpdate
6. updated:重新渲染后会触发updated
7. beforeDestroy:在实例销毁之前调用。在这一步，实例仍然完全可用
8. destroyed:在Vue实例销毁后调用。调用后，Vue实例指示的所有东西都会解绑定，所有的事件监听器会被移除，所有的子实例也会被销毁

vue-router的导航守卫

1. 导航被触发。
2. 在失活的组件里调用 beforeRouteLeave 守卫。
3. 调用全局的 beforeEach 守卫。
4. 在重用的组件里调用 beforeRouteUpdate 守卫 (2.2+)。
5. 在路由配置里调用 beforeEnter。
6. 解析异步路由组件。
7. 在被激活的组件里调用 beforeRouteEnter。
8. 调用全局的 beforeResolve 守卫 (2.5+)。
9. 导航被确认。
10. 调用全局的 afterEach 钩子。
11. 触发 DOM 更新。
12. 调用 beforeRouteEnter 守卫中传给 next 的回调函数，创建好的组件实例会作为回调函数的参数传入。