下面是分步骤解释vue生命周期

1、开始:new Vue()

创建vue对象过程还是比较繁琐的,所以创建vue对象是异步执行的。

回调函数:beforeCreate

2、Observe Data

监控模型层的数据

3、Init Events

初始化事件

回调函数:created

4、验证是否有el和template

回调函数:beforeMount

5、Create vm.$el and replace el with it

创建vue对象里的属性和方法

回调函数:mountend

6、Mounted    

初始化工作结束后,进入工作状态,我们看到他在监控视图层,监控模型层,数据变化要对应的变化,所以这是一个循环的。

回调函数:beforeUpdate 和updated

销毁时机:调用函数vm.$destroy

回调函数:beforeDestroy

7、Teardown watchers,child components and event listeners

销毁时,不再监控

8、Destroyed

回调函数:destroyed

此时vue对象被彻底的销毁。

4、VUE生命周期的更多相关文章

  1. vue生命周期的介绍

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  2. vue 生命周期

    一 vue的生命周期如下图所示(很清晰) 二 vue生命周期的栗子 注意触发vue的created事件以后,this便指向vue实例,这点很重要 <!DOCTYPE html> <h ...

  3. 详解vue生命周期

    vue生命周期 @(vue)[生命周期] 前言 在使用vue一个多礼拜后,感觉现在还停留在初级阶段,虽然知道怎么和后端做数据交互,但是对于mounted这个挂载还不是很清楚的.放大之,对vue的生命周 ...

  4. 关于vue生命周期

    官网给出的实例的生命周期图如下: beforeCreate(页面创建前),created(页面创建后),beforeMount(页面载入前),mounted(页面载入后),beforeUpdate(页 ...

  5. vue生命周期的理解

    我从官网上下载了一张vue生命周期的图,接下来实际分析一波vue到底执行了什么东西. 1.我们在使用vue时必不可少的操作就是 var vm = new Vue({}),这样我们就创建了一个vue的实 ...

  6. Vue生命周期,面试常见问题

    一.对于MVVM的理解? MVVM 是 Model-View-ViewModel 的缩写.Model代表数据模型,也可以在Model中定义数据修改和操作的业务逻辑.View 代表UI 组件,它负责将数 ...

  7. 【Vue笔记】-- 详解vue生命周期

    针对于Vue的生命周期进行详细的说明,方面加深对各个方法的引用. 引言: 前几天重新回顾vue官网时,看到vue的生命周期,想着自己用vue开发了快一年了,就总结总结vue知识,再次加深自己对vue的 ...

  8. 面试题之(vue生命周期)

    在面试的时候,vue生命周期被考察的很频繁. 什么是vue生命周期呢? Vue实例有一个完整的生命周期,也就是从开始创建.初始化数据.编译模板.挂载Dom.渲染→更新→渲染.卸载等一系列过程,我们称这 ...

  9. [转] Vue生命周期

    Vue生命周期 这是Vue文档里关于实例生命周期的解释图 那么下面我们来进行测试一下 <section id="app-8"> {{data}} </sectio ...

  10. vue生命周期、钩子函数

    https://segmentfault.com/a/1190000011381906    详解生命周期和钩子函数 每个vue实例再被创建之前都要经过一系列的初始化过程,这个过程就是vue的生命周期 ...

随机推荐

  1. C 语言实现回调函数

    优点 不需要改变调用的主函数,只需添加命令和相应函数. #include "stdio.h" #include "stdlib.h" #include &quo ...

  2. Flask拾遗总汇1

    目录 1.flask的路由分发方式 2.请求响应相关 3.flask配置文件拾遗(config) 4.路由系统参数配置 4.1 可传入参数: 4.2 常用路由系统有以上五 5.反向生成URL: url ...

  3. 【若泽大数据】玩转大数据之Spark零基础到实战

    https://www.bilibili.com/video/av29407581?p=1 若泽大数据官网 http://www.ruozedata.com/ tidb 系列三:有了sparkjdbc ...

  4. python3字符串的方法及注释/ 字符串格式化符号含义及格式化符号含义

     capitalize()   把字符串的第一个字符改为大写   casefold()   把整个字符串的所有字符改为小写   center(width)   将字符串居中,并使用空格填充至长度wid ...

  5. robotframework-selenium2library各个版本

    https://github.com/robotframework/Selenium2Library/downloads

  6. nginx 请求文件 进行用户认证/鉴权: internal(限制为内部调用)

    在进行WEB开发时, 必然会遇到向用户返回文件的场景(如图片, 文档等等), 当返回的文件较小时, 我们可以直接通过接口以数据流的形式向前台返回, 因为文件较小, 因此也不会太过于影响响应速度及服务器 ...

  7. webpack 的安装与使用

    这里使用webpack4.41.2 为例 一.安装webpack 1.本地安装,安装最新版本或特定版本 npm install --save-dev webpack npm install --sav ...

  8. ArrayList与String[]

    不逼自己一把,你永远不知道什么是绝望. 今天被初学java的朋友问到了String[]跟ArrayList是不是有关系呢? 猜测是名称之间的联想,记此篇解惑. Array英语单词里是数组.阵列的意思, ...

  9. LeetCode 1213. Intersection of Three Sorted Arrays

    原题链接在这里:https://leetcode.com/problems/intersection-of-three-sorted-arrays/ 题目: Given three integer a ...

  10. java信号量

    维基百科解释的信号量概念如下 信号量(英语:semaphore)又称为信号标,是一个同步对象,用于保持在0至指定最大值之间的一个计数值.当线程完成一次对该semaphore对象的等待(wait)时,该 ...