对于使用Vue框架进行开发的用户来说,Vue的生命周期函数是一个非常重要的概念。理解好他,对于我们后续的开发以及debugger都会带来非常大的帮助。根据Vue官方的介绍,我们知道Vue一个有4个生命周期,8个钩子函数,具体的生命周期函数如Vue官网所示。
对Vue的生命周期函数有了一定的了解后,接下来我们对生命周期的一些具体问题进行深入解析:
- 问题一:组件实例在初始化过程中会经历哪些钩子函数?
答:对于一个组件,在进行初始化的过程中,会依次的执行beforeCreate->created->beforeMount->mounted四个周期函数,
当组件所template的data(该数据必须是响应式的)被改变后,会依次的执行beforeUpdate->updated两个周期函数
当组件被销毁后,会依次的执行beforeDestroy->destroyed
- 问题二:在不同的钩子函数下,可以获取到哪些值?
答:在beforeCreate阶段,data和props里面的数据都是读不到的
在created以及后续阶段,data和props里面的数据是可以读到的
- 问题三:props和data里面的数据,究竟是哪一个先加载到呢?
答:props里面的数据先于data加载,这样在data里面就可以读取到props里面的数据了。
- 问题四:有哪些钩子函数的执行是先于组件dom渲染的?
答:在beforeCreate、created、beforeMount这三个阶段中,都是获取不到页面的dom元素,只有在mounted及其之后阶段才可以获取的到
- 问题五:哪些操作会导致组件销毁的?
答:在进行路由跳转的情况下
在v-if判断语句的结果改变的情况下
在改变组件的key中