初入vue的朋友可能会疑惑，组件初始化的时候,created，props，data到底谁先执行？

今天，我就带大家从源码的角度看看到底谁先执行？

我们知道,vue是个实例

那我们就从new Vue()开始，看看到底做了什么，首先是_init方法，初始化，我们点进去继续看看

可以看到首先是进行初始化生命周期，初始化事件中心，初始化渲染等操作，在created之前，这也就说明了为什么在created的时候无法进行dom操作

好了，这里主要的是initState函数，我们继续点进去

好了 看到这个函数，大家应该一目了然了吧

总结：执行顺序beforeCreate  ->inject -> Props ->  Methods ->  Data -> Computed -> Watch ->provide-> created

谁先执行？props还是data或是其他？ vue组件初始化的执行顺序详解的更多相关文章

  1. React生命周期执行顺序详解

    文章内容转载于https://www.cnblogs.com/faith3/p/9216165.html 一.组件生命周期的执行次数是什么样子的??? 只执行一次: constructor.compo ...

  2. javascript运行机制之执行顺序详解(转)

    转自http://www.admin10000.com/document/3385.html JavaScript是一种描述型脚本语言,它不同于java或C#等编译性语言,它不需要进行编译成中间语言, ...

  3. Unity 继承MonoBehaviour脚本 执行顺序 详解

    先看结果 Awake ->OnEnable-> Start ->-> FixedUpdate-> Update  -> LateUpdate ->OnGUI ...

  4. 【Node.js】Event Loop执行顺序详解

    本文基于node 0.10.22版本 关于EventLoop是什么,请看阮老师写的什么是EventLoop 本文讲述的是EventLoop中的执行顺序(着重讲setImmediate, setTime ...

  5. javascript 执行顺序详解

    JavaScript是一种描述 型脚本语言,它不同于java或C#等编译性语言,它不需要进行编译成中间语言,而是由浏览器进行动态地解析与执行.如果你不能理解javaScript 语言的运行机制,或者简 ...

  6. async/await 执行顺序详解

    随着async/await正式纳入ES7标准,越来越多的人开始研究据说是异步编程终级解决方案的 async/await.但是很多人对这个方法中内部怎么执行的还不是很了解,本文是我看了一遍技术博客理解 ...

  7. Java学习之继承中的执行顺序详解

    代码块(理解) (1)用{}括起来的代码. (2)分类: A:局部代码块 用于限定变量的生命周期,及早释放,提高内存利用率. B:构造代码块 把多个构造方法中相同的代码可以放到这里,每个构造方法执行前 ...

  8. Python装饰器执行顺序详解

    探究多个装饰器执行顺序 装饰器是Python用于封装函数或代码的工具,网上可以搜到很多文章可以学习,我在这里要讨论的是多个装饰器执行顺序的一个迷思. 疑问 大部分涉及多个装饰器装饰的函数调用顺序时都会 ...

  9. javascript运行机制之执行顺序详解

    1.代码块 指的的是有标签分割的代码段. 例如: <script type="text/javascript"> alert("这是代码块一"); ...

随机推荐

  1. Oracle-常见的命令

    --------------输入一下指令,按下快捷键 F8 select * from emp; --------------创建表格 create table 表名( 字段名1 数据类型1, 字段名 ...

  2. 基于python的自动化测试框架搭建

    滴~ 今日打卡!   好多天没来打卡了.博主最近一直在把碎片化知识转化为知识体系的过程中挣扎.Python语言.selenium.unittest框架.HTMLTestRunner框架都有所了解,也写 ...

  3. 使用Python进行自动化测试

    目前大家对Python都有一个共识,就是他对测试非常有用,自动化测试里Python用途也很广,但是Python到底怎么进行自动化测试呢?今天就简单的向大家介绍一下怎么使用Python进行自动化测试,本 ...

  4. Python Hacking Tools - Password Sniffing

    Password Sniffing with Scapy 1. Download and install the Scapy first. pip install scapy https://scap ...

  5. Python Ethical Hacking - VULNERABILITY SCANNER(5)

    EXPLOITATION - XSS VULNS XSS - CROSS SITE SCRIPTING VULNS Allow an attacker to inject javascript cod ...

  6. db2创建nickname

    db2创建nickname创建步骤 1.创建 server create server servername type DB2/AIX version 10.5 wrapper drda authid ...

  7. Java对象创建模式

    创建Java对象时,对于可为空的属性,创建对象的时候有3种模式:重叠构造器模式.JavaBeans模式.Builder模式(推荐).Stream模式(推荐).                     ...

  8. C++语法小记---经典问题之一(一个空类包含什么)

    问题:一个空类包含什么 空的构造函数 拷贝构造函数(浅拷贝) 重载赋值操作符函数(浅拷贝) 析构函数 取址运算符 取址运算符const 注意 所有的这些默认函数,只有在代码中调用了才会生成,否则也不会 ...

  9. JS闭包应用场景之函数回调（含函数的调用个人理解）

    首先我们来绑定一个函数给click事件,这个很好理解,就是创建一个匿名函数作为回调绑定给click事件,如下: 但如果我们想声明一个函数作为回调来绑定多个元素呢,例如下面(注意:绑定事件后不用加括号, ...

  10. lua 表

    最近在尝试配置 awesome WM,因此粗略地学习了一下 lua . 在学习过程中,我完全被表表在 lua 中的应用所镇住了. 表在 lua 中真的是无处不在:首先,它可以作为字典和数组来用:此外, ...