Web前端学习笔记：Vue生命周期理解

一、感谢原创博主

示例代码出处====vue2.0 探索之路——生命周期和钩子函数的一些理解
官方文档

二、生命周期简单描述

总共分为8个阶段创建前/后，载入前/后，更新前/后，销毁前/后。

创建前/后

在beforeCreated阶段，vue实例的挂载元素el和数据对象data都为undefined，还未初始化。
在created阶段，vue实例的数据对象data有了，$el还没有。
载入前/后

在beforeMount阶段，vue实例的el和data都初始化了，但还是挂载之前为虚拟的dom节点，data.message还未替换。
在mounted阶段，vue实例挂载完成，data.message成功渲染。
更新前/后

当data变化时，会触发beforeUpdate和updated方法。

销毁前/后

在执行destroy方法后，对data的改变不会再触发周期函数，说明此时vue实例已经解除了事件监听以及和dom的绑定，但是dom结构依然存在

我发现再怎么写也和上博主的差不多，上博主写的很好很详细了，新手多看几遍，再际动手跟踪给出的示例代码，应该就可以理解了。

转载于:https://juejin.im/post/5cecd3b25188256c944e7ce7

Web前端学习笔记：Vue生命周期理解相关推荐

day4 vue 学习笔记组件生命周期数据共享数组常用方法
系列文章目录 day1学习vue2笔记 vue指令 day2 学习vue2 笔记过滤器侦听器计算属性 axios day3 vue2 学习笔记 vue组件 day4 vue 学习笔记组件生命 ...
web前端学习笔记（最新）
web前端学习笔记大家好,我是链表哥,新的学期,新的学习,我会为您展示我的学习进程. 一:什么是WEB前端? 所谓的Web前端指的是用户所能接触到的,并服务于用户的前沿端口,经我们程序员编辑修饰后展 ...
Gavin小黑屋——Vue 学习笔记：生命周期特点（先渲染HTML标签再渲染数据）
Vue基础生命周期特点(先渲染HTML标签再渲染数据) 目录 Vue基础生命周期特点(先渲染HTML标签再渲染数据) 一.Vue生命周期 Vue 的生命周期总共分为8个阶段:创建前/后,载 ...
Web前端学习笔记——AngularJS之简介、起步、特性
目录 Angular 简介 Angular 是什么特性发展历史起源困境 Angular 2 横空出世 ng2 相比 ng1 现状那我为什么要学习使用 Angular ? 学习 Angular ...
IOS学习笔记——ViewController生命周期详解
在我之前的学习笔记中讨论过ViewController,过了这么久,对它也有了新的认识和体会,ViewController是我们在开发过程中碰到最多的朋友,今天就来好好认识一下它.ViewContro ...
Web前端学习笔记（1）
文章目录一.第一部分 1.1内容一 Web前端导入二.第二部分 2.1内容一 HTML和CSS的定义三.第三部分 3.1内容一宇宙第一编译器Vs Code 3.2内容二快捷键的使用四.第四 ...
Web前端学习笔记学习路线图
随着互联网的快速发展, web前端行业发展前景较好,虽然web前端薪资高入门门槛低, 但是俗话说的好:入门容易,精通难.web前端开发的知识点繁多,所以,要想真正全部掌握web前端工程师开发技能,并非 ...
web前端学习笔记总页面
学习资料自学视频求知讲堂web前端html+css 参考文档 MDN 书单你不知道JavaScript JavaScript设计模式和开发实践 css世界 css揭秘什么是web前端开发 we ...
极客学院web前端学习笔记（一）概况
终于到暑假啦!暑假开始重新(x)学习web前端,其实html和css早已有所接触,但是js接触较少,直接原因是下学期大概要给学弟学妹们解答一些前端基础相关的问题,所以希望在暑假好好整理归纳一下知识体系 ...

Web前端学习笔记：Vue生命周期理解

一、感谢原创博主

二、生命周期简单描述

我发现再怎么写也和上博主的差不多，上博主写的很好很详细了，新手多看几遍，再际动手跟踪给出的示例代码，应该就可以理解了。

Web前端学习笔记：Vue生命周期理解相关推荐

最新文章

热门文章