vue的生命周期函数,就是vue从被实例化new vue()开始到被销毁的各个阶段的钩子函数。
这个过程可以比拟为:程序员的一生。
生命周期函数细分成8个阶段: beforeCreate、Created、beforeMounted、Mounted、beforeUpdate、updated、beforeDestory、destroyed
beforeCreate:
这个阶段等同于人刚出生不久,什么也不会,啥也做不了,需要时间成长。
vue在这个阶段,什么也还没创建,data、methods的数据和方法也访问不到。
Created:
这个阶段等同于人上小学了,能写字、会加减乘除了,但你拿道高数题给他做,[黑脸]他要哭死,所以还得再等等。
vue在这个阶段,data、methods的数据和方法能访问了,但是DOM节点还没生成,如果methods中有涉及获取dom节点的操作,那么对不起,找不到。
beforeMounted:
这个阶段等同于人读大学阶段,高数能算了、计算机编程基础也会了,坐等来社会上闯了。
vue在这个阶段,内存中已经编译好模板了,但是还没有挂载到页面。
Mounted:
这个阶段等同于人到青年,毕业了,满腔热血,准备北上广深大干一番。
vue在这个阶段,实例已经初始化完成了,data、methods、dom都能随便操作,处理业务逻辑了。
beforeUpdate:
这个阶段等同于拼搏1-2年后的状态,发现理想很丰满,现实很骨感,以为顶多是996模式,结果是007,于是准备调整状态,提高效率。
vue在这个阶段,data中的数据是更新后的, 页面还没有和最新的数据保持同步。
updated:
这个阶段人到中年,反反复复,打不死的小强,不断调整更新,达到人生巅峰。
vue在这个阶段,页面和data中的数据已经保持同步了,都是最新的。
beforeDestory:
这个阶段人到老年,退休了,该吃吃该喝喝,安享晚年。
vue在这个阶段,data中的数据是更新后的, 页面还没有和最新的数据保持同步。
destroyed:
这个阶段人到临终,高数、编程、房子车子、理想……什么都不重要了,等下一个轮回再来折腾。
vue在这个阶段,data 和 methods , 指令, 过滤器 ……都是处于不可用状态,组件已经被销毁了。
以上纯属个人扯淡,如有错误,欢迎指正!