博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Vue实例的生命周期
阅读量:4094 次
发布时间:2019-05-25

本文共 570 字,大约阅读时间需要 1 分钟。

生命周期的概念

从Vue实例创建、运行、到销毁期间,总是伴随着各种各样的事件、这些事件统称为生命周期。

生命周期钩子

就是生命周期事件的别名

生命周期函数的分类

创建期间的生命周期函数

  • beforeCreate:实例刚在内存中被创建出来,此时还没有初始化好datamethods属性
  • created:实例已经在内存中创建完成,此时datamethods属性已经初始化好,可以被使用。但是还没有开始编译模板(指页面的DOM)
  • beforeMount:已完成模板的编译,但是还没有挂载到页面中,此时无法操作DOM元素
  • mounted:已经将编译好的模板,挂载到了页面指定的容器中显示,此时可以操作DOM元素

运行期间的生命周期函数

  • beforeUpdate:状态更新之前执行此函数,此时data中的状态值是最新的,但是页面上显示的数据还是旧的。因为此时还没有开始重新渲染DOM节点
  • updated:实例更新完毕之后调用此函数,此时data中的状态值和页面上显示的数据是一致的,均已完成更新。页面已重新渲染好

销毁期间的生命周期函数

  • beforeDestroy:实例销毁之前调用,在这一步,实例依然完全可用
  • destroyed:Vue实例销毁后调用。调用后,Vue实例指示的所有东西都会解绑定,所有的事件监听器会被移除,所有的子实例也会被销毁在这里插入图片描述

转载地址:http://gmtii.baihongyu.com/

你可能感兴趣的文章
解析Java中的String对象的数据类型
查看>>
验证用户名,AJAX步骤示例
查看>>
AJAX w3school 以及IE、Firefox、Chrome 的JS代码兼容注意事项
查看>>
Js事件绑定时,函数名加括号和不加括号有什么区别
查看>>
套接字
查看>>
PrintWriter out = response.getWriter()
查看>>
AJAX 示例:xml数据类型返回
查看>>
AJAX实现步骤,XMLHttpRequest对象的方法
查看>>
jQuery ajax - ajax() 方法
查看>>
table结构本身有tbody
查看>>
jQuery 遍历 - each() 方法
查看>>
jQuery 选择器--w3school
查看>>
练习jQuery 。table切换
查看>>
正则表达式
查看>>
AJAX ,在jsp处理 action返回的不同数据类型
查看>>
SVN设置笔记1,CentOS装SVN
查看>>
SVN设置笔记2,MyEclipse装SVN插件
查看>>
SVN设置笔记3,项目使用SVN
查看>>
TestSingletonDemo:
查看>>
使用Hibernate步骤:(一)
查看>>