Vue2.0 相对于Vue1.0的变化:生命周期
根据提供的生命周期钩子说明Vue.js实例各个阶段的情况,Vue.js 2.0对不少钩子进行了修改,以下说明:(灰色字体代表是 2.0已经废弃或者被更名的钩子,黑色字体代表1.0 和2.0中 都有的钩子,红色字体代表 2.0新增的钩子);
init : 在实例开始初始化时同步调用,此时数据观测、时间等都尚未初始化。2.0中更名为 beforeCreate。
created:在实例创建之后调用,此时已经完成数据绑定、事件方法,但尚未开始 DOM 编译,即未挂载到 document 中。
beforeCompile:在 DOM 编译前调用,Vue 2.0废弃了该方法,推荐使用 created 。
beforeMount:2.0 新增的生命周期钩子,在 mounted 之前运行。
compiled:在编译结束时调用。此时所有指令已生效,数据变化已能触发 DOM 更新,但不保证 $el 已插入文档 。2.0 中更名为 mounted;
ready:在编译结束和 $el 第一次插入文档之后调用。2.0 废弃了该方法,推荐使用 mounted。这个变化其实已经改变了 ready 这个生命周期状态,相当于取消了在 $el 首次插入文档后的钩子函数。
attached:在 vm.$el 插入 DOM 时调用,ready 会在第一次 attached 后调用。操作 $el 必须使用指令或实例方法(例如 $appendTo()),直接操作 vm.$el 不会触发这个钩子。2.0 废弃了该方法,推荐在其他钩子中自定义方法检查是否已挂载。
detached: 同 attached 类似,该钩子在 vm.$el 从 DOM 删除时调用,而且必须是指令或实例方法。2.0 中同样废弃了该方法。
beforeDestory: 在开始销毁实例时调用,此刻实例仍然有效。
destoryed:在实例被销毁之后调用。此时所有绑定和实例指令都已经解绑,子实例也被销毁。
beforeUpdate:2.0 新增的生命周期钩子,在实例挂载会后,再次更新实例(例如更新 data)时会调用该方法,此时尚未更新 DOM 结构。
updated:2.0新增的生命周期钩子,在实例挂载之后,再次更新实例并更新完 DOM 结构后调用。
activated:2.0 新增的生命周期钩子,需要配合动态组件 keep-live 属性使用。在动态组件初始化渲染的过程中调用该方法。
deactivated:2.0 新增的生命周期钩子,需要配合动态组件 keep-live 属性使用。在动态组件移出的过程中调用该方法。
转载于:https://www.cnblogs.com/gluncle/p/8334629.html
Vue2.0 相对于Vue1.0的变化:生命周期相关推荐
- Spring4.0学习笔记(5) —— 管理bean的生命周期
Spring IOC 容器可以管理Bean的生命周期,Spring允许在Bean生命周期的特定点执行定制的任务 Spring IOC 容器对Bean的生命周期进行管理的过程: 1.通过构造器或工厂方法 ...
- activity 生命周期_从0系统学Android-2.4 Activity 的生命周期
本系列文章,参考<第一行代码>,作为个人笔记 更多内容:更多精品文章分类 本系列持续更新中-. 2.4 Activity 的生命周期 掌握 Activity 的生命周期对于开发者来说是非常 ...
- 【白皮书分享】2020用户生命周期运营白皮书2.0.pdf(附下载链接)
大家好,我是文文(微信:sscbg2020),今天给大家分享京东和尼尔森于2020年9月联合发布的白皮书<2020用户生命周期运营白皮书2.0.pdf>,做品牌和运营的伙伴们可以重点参考下 ...
- vue 1.0和vue 2.0的变化和区别
一.在每个组件模板,不在支持片段代码 vue 1.0是 <template><h3>我是组件</h3><strong>我是加粗标签</strong ...
- vue 日期前面加0_vue日期组件 支持vue1.0和2.0
vue-datetime 使用vue编写的时间组件,小巧实用,支持vue1.0,vue2.0 v1.0 功能: 1.支持同时展开多个日期选择框 2.支持单击选中和取消,可配置单选和多选 3.支持双击启 ...
- vue2.0生命周期数据共享
3.1 组件的生命周期 1.概念 (1)生命周期:是指一个组件从创建.运行.销毁的整个阶段,强调的是一个时间段 (2)生命周期函数:是由vue框架提供的内置函数,会伴随组件的生命周期,自动按次序执行 ...
- Vue2.0 探索之路——生命周期和钩子函数的一些理解
前言 在使用vue一个多礼拜后,感觉现在还停留在初级阶段,虽然知道怎么和后端做数据交互,但是对于mounted这个挂载还不是很清楚的.放大之,对vue的生命周期不甚了解.只知道简单的使用,而不知道为什 ...
- 卸载vuecli3_卸载vue2.0并升级vue_cli3.0的实例讲解
今天来学习vue3.0,之前使用的是vue2.0现在用3.0的话你可以升级,也可以卸载再重装.我这里就是卸载重装啦. 第一步我们卸载全局的vue2.0 .你需要先通过 npm uninstall vu ...
- 创建VUE项目,vue-cli2.0版本和3.0版本的区别,将vue2.0项目升级为vue3.0项目
创建VUE项目,vue-cli2.0版本和3.0版本的区别,将vue2.0项目升级为vue3.0项目 使用vue-cli2.0版本创建vue项目 创建前的准备 开始创建 创建过程 项目正常创建 使用v ...
- vue2.0组件生命周期探讨
<!DOCTYPE html> <html><head><meta charset="UTF-8"><title>vue ...
最新文章
- ios 证书更新需要重新发布么_福利站证书更新,自己有空余时间一定要学会自己用电脑签名!...
- IIS7.5 安全配置研究(推荐)
- spring(一):spring IoC的注入方式总结
- Postman 最被低估的功能
- 东北全面放开生育,数据揭秘人口和GDP和房价间联系
- S5 Linux信息显示与搜索文件命令
- java按照字节切割字符串,解决汉字的问题
- centos下搭建网站服务器,Centos7搭建web服务器
- Qt-在控件上绘图的方式
- c语言中文件如何插入数据,急求如何将下列C语言程序数据存储到文件中?
- Windows系统USB转CDC串口驱动限制说明
- verilog设置24进制计数器_阅读笔记:《Verilog HDL入门》第3章 Verilog语言要素
- 凭借Google新算法 机器人自学行走平均只需3.5小时
- 操作系统和Linux
- linux服务器创建FTP
- 分析CHE矢量变频器在数控雕刻机床上应用
- IT系统架构及架构体系详解
- 原来动漫中的羞耻表情都是这样出来的,学会以后可以自己慢慢YY了
- java实现条形图_java – 使用Apache POI在Excel中创建条形图
- java坦克大战 实训报告_程序设计实训坦克大战实验报告