React组件生命周期-初始化阶段的函数执行顺序
<!DOCTYPE html>
<html lang="zh-cn"> <head>
<meta charset="UTF-8">
<title>Document</title>
</head> <body>
<script src="./react-0.13.2/build/react.js"></script>
<script src="./react-0.13.2/build/JSXTransformer.js"></script>
<script type="text/jsx">
var style = {
color : "red",
border: "1px #000 solid",
};
var HelloWorld = React.createClass({
getDefaultProps: function(){console.log("getDefaultProps1");},
getInitialState: function(){console.log("getInitialState2");return null;},
componentWillMount:function(){console.log("componentWillMount3")},
render: function(){
console.log("render4");
return <p>初始化阶段的函数执行状态</p>
},
componentDidMount:function(){console.log("componentDidMount5")}
});
React.render(<div style={style}><HelloWorld></HelloWorld></div>, document.body);
</script>
</body> </html>
React组件生命周期-初始化阶段的函数执行顺序的更多相关文章
- React组件生命周期小结
React组件生命周期小结 下面所写的,只适合前端的React.(React也支持后端渲染,而且和前端有点小区别,不过我没用过.) 相关函数 简单地说,React Component通过其定义的几个函 ...
- React—组件生命周期详解
React—组件生命周期详解 转自 明明的博客 http://blog.csdn.net/slandove/article/details/50748473 (非原创) 版权声明:转载请注明出处,欢 ...
- vue 源码详解（二）： 组件生命周期初始化、事件系统初始化
vue 源码详解(二): 组件生命周期初始化.事件系统初始化 上一篇文章 生成 Vue 实例前的准备工作 讲解了实例化前的准备工作, 接下来我们继续看, 我们调用 new Vue() 的时候, 其内部 ...
- 1.4 React 组件生命周期
1.4.1 组件 React 中组件有自己的生命周期方法,简单理解可以为组件从 出生(实例化) -> 激活 -> 销毁 生命周期 hook.通过这些 hook 方法可以自定义组件的特性. ...
- 一起学习vue源码 - Vue2.x的生命周期(初始化阶段)
作者:小土豆biubiubiu 博客园:https://www.cnblogs.com/HouJiao/ 掘金:https://juejin.im/user/58c61b4361ff4b005d9e8 ...
- 你还不知道Vue的生命周期吗？带你从Vue源码了解Vue2.x的生命周期(初始化阶段)
作者:小土豆biubiubiu 博客园:https://www.cnblogs.com/HouJiao/ 掘金:https://juejin.im/user/58c61b4361ff4b005d9e8 ...
- 野心勃勃的React组件生命周期
当你还在写着Angular指令,过滤器,注入,服务,提供者,视图模版的时候,是不是觉得很烦,好在这个时候,React已经神一样的出现在历史舞台. React组件 React实现了UI=Fn(St ...
- 深入React组件生命周期
上篇博文使用React开发的一些注意要点对React开发的一些重点进行了简单的罗列总结,虽然也提到了React生命周期,但只略微小结,在此单独写篇React生命周期的总结. 在组件的整个生命周期中,随 ...
- React组件生命周期过程说明
来自kiinlam github94 实例化 首次实例化 getDefaultProps getInitialState componentWillMount render componentDidM ...
随机推荐
- 元音字母A的发音规则
摘抄自百度文库 A/a的发音比较复杂,归纳起来有10种情况: 一．在重读开音节中读[ei]. 例如: plane [plein] radio [ˈreidiəu] wake [weik] pape ...
- git创建分支并提交项目
git 创建分支, 切换分支, 合并分支, 删除分支及提交[commit提交到本地仓库push名利提交到远程服务器], 检出[pull], 冲突修改, 本地仓库同步远程服务器[pul和push命令l] ...
- C语言中链表节点的实现,以及如何实现泛型
1.C语言中的struct是纯粹的结构体,没有访问权限的概念 2.C语言中用void* 来实现泛型编程,也是C++类和模板底层实现的基础,就是用void*来实现的 #include<stdio. ...
- c读取文本文档
想数一下文本文档一共有多少行,写了个小程序 1.用fopen()以只读方式打开文件 2.用fgetc()获取文件流中的字符内容 3.如果字符内容为'\n'换行符,count++ 最后输出count的值 ...
- 封装getByClass
方法一:(普通版),获取单一的class: function getByClass(oParent, sClass) { var aResult = []; var aEle = oParent.ge ...
- Mac下的常用Shell命令
今天介绍一下在Mac的终端中一些常用的Shell命令: 1.查看当前工作目录的完整路径 pwd (pwd的原意是:print work directiory,而不是密码password的意思,呵呵) ...
- c语言学习strcopy
自己写了一个字符串复制函数: #include<stdio.h> #include<assert.h> char *mystrcpy(char *des,char *ser) ...
- Workaround for Markdown blogging platform that to use LaTeX
Here is a solution to solve the lack of LaTeX support: by using Codecogs API. For instance, if you n ...
- python 交换变量值
在其他语言中,交换两个变量值的时候,可以这样写: temp = a a = b b = temp 在Python中,我们可以简单的这样写: a,b=b,a 实验如下: >>> a=1 ...
- Codeforces Round #354 (Div. 2) C. Vasya and String
题目链接: http://codeforces.com/contest/676/problem/C 题解: 把连续的一段压缩成一个数,对新的数组求前缀和,用两个指针从左到右线性扫一遍. 一段值改变一部 ...