下图展示了实例的生命周期。不需要立马弄明白所有的东西,不过随着不断学习和使用,它的参考价值会越来越高。
Vue 有八种生命周期方法:
- Before create 组件实例化之前的函数
- Created 组件实例化完毕,但页面还没显示
- Before mount 组件挂载前,页面没有显示,但虚拟Dom已经配置
- Mounted 组件挂载后,该方法执行后页面显示
- Before update 组件更新前,页面未更新,但虚拟Dom已经配置
- Updated 组件更新,方法执行后页面显示
- Before destroy 组件销毁前
- Destroyed 组件销毁
当我们将上面的8中方法写在header.vue页面后,执行效果如下,从第一开始弹出,直到页面显示