Vue生命周期钩子的总结!

总结一下vue生命周期钩子的使用条件及作用:

  • beforeCreate
在beforeCreate钩子中,组件的data和methods以及页面的Dom结构都还没有初始化完成.
  • created
在这个生命周期中的时候,组件的data,methods已经有了,dom还没有渲染出来,
此时可以发送ajax请求获取数据,可以拦截一些页面的路由跳转等
  • beforeMount
在beforeMount中时,模板已经在内存中编译完成,还没有真正的渲染到页面上,页面上没有真实的数据.
  • mounted
这是组件生成的最后一个阶段,此时才是dom真正渲染好的时候,在这个阶段如果需要用到第三方
插件的话就会在这个阶段进行初始化,或者操作dom的话也在这个阶段进行.
  • beforeUpdate
当执行这个生命周期函数的时候,肯定是数据已经发生了变化,但是页面上的数据是旧的,页面还没有进行重新渲染.
  • updated
根据最新的数据重新在内存中渲染模板结构,并把渲染好的模板结构替换到页面上.
  • beforeDestroy
当执行这个生命周期函数的时候,说明是组件即将被销毁之前,此时的组件还可以正常运行,
data/methods等数据方法依然可以被正常访问.
  • detroyed
到了这个阶段就说明组件已经被完全销毁,data和methods方法都已经被销毁.

对一些初学的小伙伴学习生命周期钩子的一点帮助....

猜你喜欢

转载自blog.csdn.net/Cinderellahh92/article/details/107745790