1. 生命周期有哪些?
创建前/后:
beforeCreate : 在new Vue() 创建实例后,
此时 data 和methods 中的数据未初始化,不能使用;
create : 此时 data 和methods 已经初始化完成,可以调用(最早可以调用或操作 data 数据和methods方法)
挂载前/后:
beforeMount: 此时内存中的模板已编译好,但还未挂载到html界面中
mountd: 模板已经挂载到html界面,(最早可以在这个阶段中操作页面上的DOM 节点)
更新前/后:
beforeUpdate : data数据已更新,页面未同步 (此时页面显示的数据是旧的)
updated : 页面数据已更新
销毁前/后:
beforeDestory:此时的实例还未被真正的销毁,Vue实例上的所有的 data methods 指令,过滤器 ,组件等都还处于可用状态。
destory: 此时的实例已经被销毁,Vue实例上的所有的 data methods 指令,过滤器 等都还不可用(DOM 结构依然存在)。
activated keep-alive 专属,组件被激活时调用
deactivated keep-alive 专属,组件被销毁时调用
2. 第一次页面加载后会触发哪几个钩子?
beforeCreate , created , beforeMount,mounted
3. Vue 获取数据(发送请求)在哪个周期函数
一般情况 creare/beforeMount/mounted 中均可,因为在这三个钩子函数中,data 已经创建完成,可以将服务器端返回的数据进行赋值
注意: 如果要操作DOM,需要在mounted 时操作
4. 异步请求在created 中的好处:
4.1 能更快的获取服务器端数据,减少页面loading时间
4.2 ssr 不支持 beforeMount/mounted钩子函数,所以放在created 中有助于一致性