React的this.props.children
this.props用来获取组件从外部传入的属性,但是this.props.children比较特殊,它是由React给添加上的,表示组件的所有子节点。
this.props.children可以用来读取子节点,或者渲染子节点。
this.props.children所代表的子节点,不仅仅是指一个DOM节点,也包括子组件,它们是可以混合显示的,例如:
<Grid>
Here is a row:
<Row />
Here is another row:
<Row />
</Grid>
1. this.props.children的值类型
this.props.children的值有三种可能:
1. 当前组件没有子节点,为 undefined
2. 若只有一个子节点,类型为 Object
3. 若有多个子节点,类型为 Array
通常不直接处理this.props.children,而是用React.Children.map/forEach等API来操作,
该API进行了类型处理,保证不会出错。
React.children的详细用法,可以参考此处。
React的this.props.children的更多相关文章
- react中对props.children进行操作
		之前写的更多的时候是直接使用简写 {props.children} 这样就可以了,但是当有时候需要对传入的子组件进行一些操作的时候需要用到React.Children方法 {React.Childre ... 
- React 的高级用法(Children、Component、createElement、cloneElement)
		React.Children props.children 代表了所有的子节点. React.Children 用于处理 props.children 的 提供了几个方法 ( map ,foreach ... 
- React中props.children和React.Children的区别
		在React中,当涉及组件嵌套,在父组件中使用props.children把所有子组件显示出来.如下: function ParentComponent(props){ return ( <di ... 
- react入门-props.children
		在ReactDOM.render里面我们写我们的自定义组件的时候有时需要加一下子元素进去: <!DOCTYPE html> <html lang="en"> ... 
- React.js 小书 Lesson22 - props.children 和容器类组件
		作者:胡子大哈 原文链接:http://huziketang.com/books/react/lesson22 转载请注明出处,保留原文链接和作者信息. 有一类组件,充当了容器的作用,它定义了一种外层 ... 
- React中的this.props.children
		React this.props.children this.props对象的属性与组件的属性一一对应,但是有一个例外,就是this.props.children属性.它表示组件的所有子节点. var ... 
- Webpack + React 开发 03 props
		React中组件的用法与原生的 HTML 标签完全一致,可以任意加入属性,比如 <HelloWorld name="John"> ,就是 HelloWorld 组件加入 ... 
- React系列之--props属性
		版权声明:本文为博主原创文章,未经博主允许不得转载. PS:转载请注明出处作者:TigerChain地址:http://www.jianshu.com/p/fa81cebac3ef本文出自TigerC ... 
- props.children 和容器类组件
		有一类组件,充当了容器的作用,它定义了一种外层结构形式,然后你可以往里面塞任意的内容.这种结构在实际当中非常常见,例如这种带卡片组件: 组件本身是一个不带任何内容的方形的容器,我可以在用这个组件的时候 ... 
随机推荐
- 感觉总结了一切python常见知识点,可直接运行版本
			#encoding=utf-8#http://python.jobbole.com/85231/#作用域a=1def A(a): a=2 print 'A:',a def B(): print 'B: ... 
- Linux命令应用大词典-第19章 文件系统管理
			19.1 mkfs:创建Linux文件系统 19.2 mke2fs:创建ext2.3.4文件系统 19.3 mkfs.ext4:创建ext4文件系统 19.4 mkfs.ext3:创建ext3文件系统 ... 
- python学习笔记04 --------------基本运算符
			1.算数运算 + 加 - 减 * 乘 / 除 % 取模(先做除法,然后返回余数) ** 乘方(幂运算) // 取整(相除,然后返回商的整数部分) 2.比较运算(返回布尔值) == ... 
- 机器学习介绍(introduction)-读书笔记-
			一,什么是机器学习 第一个机器学习的定义来自于 Arthur Samuel.他定义机器学习为,在进行特定编程的情况下,给予计算机学习能力的领域.Samuel 的定义可以回溯到 50 年代,他编写了一个 ... 
- NodeJs学习笔记01-你好Node
			如果你对NodeJs略知一二,不禁会感叹,使用JS的语法和代码习惯就能开发一个网站的后台,实现复杂的数据交互,牛! 对于学习java和php就夹生的小码农来说,简直就是靡靡之音呐~~~ 今晚带着忐忑的 ... 
- Python对文本文件逐行扫描,将含有关键字的行存放到另一文件
			#逐行统计关键字行数,并将关键字所在行存放在新的文件中 keyword = "INFO" b = open("C:\\Users\\xxx\\Documents\\new ... 
- 统计学习五:3.决策树的学习之CART算法
			全文引用自<统计学习方法>(李航) 分类与回归树(classification and regression tree, CART)模型是由Breiman等人于1984年提出的另一类决策树 ... 
- cenos环境变量配置
			Beego环境搭建和bee工具安装使用,以Windows环境为例. 首先,下载并安装好GO并配置好GOROOT和GOPATH环境变量(如果您是用msi包安装的go,那么这些环境变量已经设置好了).并在 ... 
- PK3Err0040
			PK3Err0040 The target device is not ready for debugging. Please check your configuration bit setting ... 
- JSR303中的来验证数据信息
			spring mvc之实现简单的用户管理三 博客分类: spring spring mvc spring mvc dispatcherServlet springspring mvcbean vali ... 
