浅谈vue的生命周期

1.什么是生命周期?有什么作用?

每一个vue实例在创建时都要经历一系列的初始化过程-----例如需要设置监听,编译模板,将实例挂载到dom并在数据发生变化时更新dom等等.同时这个时候也会运行一些生命周期钩子的函数,这些函数,给用户在不同阶段添加代码的机会.例如:如果需要某些插件操作dom节点,如果想在页面渲染之后弹出广告,那我们们最早可以再mounted中进行.

2.第一次加载页面会触发哪几个钩子?

beforeCreate created beforeMount mounted

3.简述每个周期应用于哪个场景?

beforeCreate:在new一个实例后,只有一些默认的生命钩子和默认事件,其他的东西还没有创建,在beforeCreate生命周期执行时,data和methods中的数据还没有初始化,不能在这个阶段使用data中的数据和methods的方法.

created:data和methods中的数据都已经初始化好了,如果调用methods中的方法和操作data中的数据最早在这个阶段进行.

beforeMount:执行这个钩子事,内存中已经编译好了模板,但是还没有挂载到页面中,此时的页面还是旧的

mounted:执行到这个钩子时,说明vue实例已经初始化完成,此时组件脱离了创建阶段进入到了运行阶段,如果需要某些插件操作dom节点,那我们们最早可以再mounted中进行

beforeUpdate:当执行这个钩子时,页面还是旧的,data中的数据是更新后的,但是页面的数据和data中的数据还没有同步.

updated:页面和data中的数据保持同步,页面是新的了.

beforeDestory:vue实例开始从运行阶段进入销毁阶段,这时,data和methods,指令,过滤器.......都是可用的,还没有真正销毁.

destoryed:这时,data和methods,指令,过滤器.......都是不可用的,组件已经被销毁了.

4.created和mounted的区别

created在模板渲染成html前调用,即通常初始化某些属性值,然后在渲染成视图.

mounted在模板渲染成html后调用,通常是页面初始化之后,再对dom节点进行操作时.

5.vue在哪个生命周期获取数据?

一般created/beforeMount/mounted都可以

总结

本篇文章就到这里了,希望能够给你带来帮助,也希望您能够多多关注脚本之家的更多内容!

你可能感兴趣的:(浅谈vue的生命周期)