Vue中的生命周期介绍
什么是vue的生命周期
Vue中的生命周期是指组件从创建到销毁的一系列过程。看下面这张官方文档的图:
文章图片
从图片中可以看出Vue的整个生命周期包括8个状态,按照先后顺序分别为:
- beforeCreate
- Created
- beforeMount
- mounted
- beforeUpdate
- updated
- beforeDestroy
- destroyed
文章图片
创建阶段和销毁阶段在组件的生命周期中只会执行一次,而更新阶段会执行多次。
先看一下创建阶段完成的事情:
文章图片
在看更新阶段完成的事情:
文章图片
最后在看一下销毁阶段完成的事情:
文章图片
先看下面的一段代码:
生命周期 - 锐客网
在控制台的console里面查看运行后的效果:
文章图片
然后点击“更新数据”按钮,会看到input绑定的数据发生变化:
数据更新前:
文章图片
数据更新后:
文章图片
控制台显示的打印信息:
文章图片
最后点击“销毁组件”按钮,查看控制台显示的打印信息:
文章图片
这样,一个完整的Vue实例生命周期就结束了。
注意:Vue组件被销毁以后,这时如果在更新数据就不会有任何反应了,因为组件已经被销毁【Vue中的生命周期介绍】到此这篇关于Vue生命周期的文章就介绍到这了。希望对大家的学习有所帮助,也希望大家多多支持脚本之家。
推荐阅读
- 神经网络|深度学习中的五大正则化方法和七大优化策略
- 日常小技巧|关于sort函数中的cmp参数的笔记(C++)
- 详解在vue3中使用jsx的配置以及一些小问题
- Java中的运算符你知道多少
- vue|vue @input带参数_Vue组件通信详解
- Spring Cloud Ribbon 中的 7 种负载均衡策略
- 浅谈VueUse设计与实现
- Spring|Spring Cloud Ribbon 中的 7 种负载均衡策略
- 手写|手写 Vue 系列 之 Vue1.x
- Python|用Python去除扫描型PDF中的水印