new Vue
创建vue实例
init events & liftcycle
开始初始化
beforeCreate
组件刚被创建,组件属性计算之前,如data属性等
init injections & reactivity
通过依赖注入导入依赖选项
created
组件实例创建完成,属性已绑定,此时DOM还未生成
el属性
检查vue配置,即new Vue{}里面的el项是否存在,有就继续检查template项。没有则等到手动绑定vm.$mount();
template
检查配置的template项,如果没有template进行填充被绑定区域,则被绑定区域的el对象的outerHTML(即整个app DOM对象,包括<div id="app">和</div>标签)都作为被填充对象替换掉填充区域
beforeMount
模板编译、挂载之前
create vm.$el and replace 'el' with it 
编译,并替换了被绑定元素
mounted
编译、挂载
Before update
组件更新之前
updated
组件更新之后
destroy
当vm.$destroy()被调用,开始拆分组件和监听器,生命周期终结

vue生命周期和钩子函数的更多相关文章

  1. vue教程2-01 vue生命周期、钩子函数

    vue教程2-01 vue生命周期.钩子函数 <!DOCTYPE html> <html lang="en"> <head> <meta ...

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

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

  3. Vue基础进阶 之 Vue生命周期与钩子函数

    Vue生命周期 Vue生命周期:Vue实例从创建到销毁的过程,称为Vue的生命周期: Vue生命周期示意图:https://cn.vuejs.org/v2/guide/instance.html#生命 ...

  4. Vue生命周期和钩子函数及使用keeplive缓存页面不重新加载

    Vue生命周期 每个Vue实例在被创建之前都要经过一系列的初始化过程,这个过程就是vue的生命周期,在这个过程中会有一些钩子函数会得到回调 Vue中能够被网页直接使用的最小单位就是组件,我们经常写的: ...

  5. 引入jquery利用Vue生命周期的钩子函数mounted操作DOM

    html <div id="app"> <div>{{message}}</div> </div> js var vm = new ...

  6. vue学习之生命周期和钩子函数

    参考文章:Vue2.0 探索之路——生命周期和钩子函数的一些理解 抛出问题: 我们有时候会在几个钩子函数里做一些事情,那么什么时候做,该在哪个函数里做? 生命周期简介 结合代码看el 和 data以及 ...

  7. Vue(3)- 安装脚手架、过滤器、生命周期的钩子函数、vue-router基本使用

    一.安装脚手架 1.下载node.js,本文下载版本为node-v8.12.0-x64.msi,一键式安装. 2.安装完成后,打开终端,输入node,可进入node环境(两次ctrl+c退出),如下图 ...

  8. Vue 3 --安装脚手架、过滤器、生命周期的钩子函数、vue-router基本使用

    一.安装脚手架 1.下载node.js,本文下载版本为node-v8.12.0-x64.msi,一键式安装. 2.安装完成后,打开终端,输入node,可进入node环境(两次ctrl+c退出),如下图 ...

  9. vue学习笔记(二)vue的生命周期和钩子函数

    前言 通过上一章的学习,我们已经初步的了解了vue到底是什么东西,可以干什么,而这一篇博客主要介绍vue的生命周期和它常用的钩子函数,如果有学过java的园友可能有接触到在学习servlet的时候学过 ...

随机推荐

  1. 【笔记】Nginx热更新相关知识

    (以下学习笔记内容均摘自参考链接,仅供个人查阅)   1.inotify文件系统监控特性 Inotify 是一个 Linux 内核特性,它监控文件系统,并且及时向专门的应用程序发出相关的事件警告,比如 ...

  2. canvas 模拟时钟

    <meta charset="utf-8"> <canvas width="1000" height="1000" id= ...

  3. 射频(SX1278)

    射频是什么? 官方说法:RF,Radio Frequency. (不懂的人,看了还是不懂,不过对于物联网行业的开发工程师.产品经理和项目经理,还是有需要对射频有个基础了解的.) 燚智能解读: 两个人, ...

  4. Activex、OLE、COM、OCX、DLL之间区别、联系[转]

    转自:http://baike.baidu.com/view/393671.htm 创建COM:http://blog.csdn.net/henry000/article/details/700839 ...

  5. 方差分析 | ANOVA | 原理 | R代码 | 进阶 | one way and two way

    原理 比较两组就用t-test,比较三组及以上就用ANOVA.注意:我们默认说的都是one way ANOVA,也就是对group的分类标准只有一个,比如case和control(ABCD多组),tw ...

  6. f-stack中ipc传递指针从应用中读取信息时挂掉

    f-stack中ipc传递指针从应用中读取信息时挂掉 如:创建bridge0./ifconfig bridge0 create./ifconfig f-stack-0 down./ifconfig f ...

  7. 字符串sorted,和sort区别

    s=["a","s","b"] s.sort() print(s) ['a', 'b', 's'] s=["a",&qu ...

  8. docker-compose的使用

    docker-compose的介绍 Compose是一个定义和管理多容器的工具,使用Python语言编写.使用Compose配置文件描述多个容器应用的架构,比如使用什么镜像.数据卷.网络.映射端口等; ...

  9. 突破防盗链Referrer

    //引用的源码网站的js<script src="https://raw.githack.com/jpgerek/referrer-killer/master/referrer-kil ...

  10. 【C/C++】C++11 Variadic Templates

    Variadic Templates 1.function template:利用“参数个数逐一递减”的特性,实现递归函数调用 template <typename T, typename... ...