Vue生命周期

beforeCreate(创建前): 在数据观测和初始化事件还未开始,data、watcher、methods都还不存在,但是$route已存在,可以根据路由信息进行重定向等操作。

created(创建后):在实例创建之后被调用,该阶段可以访问data,使用watcher、events、methods,也就是说 数据观测(data observer) 和event/watcher 事件配置 已完成。但是此时dom还没有被挂载。该阶段允许执行http请求操作。

beforeMount (挂载前):将HTML解析生成AST节点,再根据AST节点动态生成渲染函数。相关render函数首次被调用(划重点)。

mounted (挂载后):在挂载完成之后被调用,执行render函数生成虚拟dom,创建真实dom替换虚拟dom,并挂载到实例。可以操作dom,比如事件监听

beforeUpdate: v m . d a t a 更 新 之 后 , 虚 拟 d o m 重 新 渲 染 之 前 被 调 用 。 在 这 个 钩 子 可 以 修 改 vm.data更新之后,虚拟dom重新渲染之前被调用。在这个钩子可以修改 vm.datadomvm.data,并不会触发附加的冲渲染过程。

updated:虚拟dom重新渲染后调用,若再次修改$vm.data,会再次触发beforeUpdate、updated,进入死循环。

beforeDestroy:实例被销毁前调用,也就是说在这个阶段还是可以调用实例的。

destroyed:实例被销毁后调用,所有的事件监听器已被移除,子实例被销毁。

Vue在哪个生命周期阶段调用异步请求最佳

异步请求在哪个阶段都可以调用,因为会先执行完生命周期的钩子函数之后,才会执行异步函数,但如果考虑用户体验方面的话,在created中调用异步请求最佳,用户就越早感知页面的已加载,毕竟越早获取数据,在mounted实例挂载的时候就越及时。

Logo

前往低代码交流专区

更多推荐