-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
3 changed files
with
23 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,3 @@ | ||
# React.Children.only | ||
> 验证 `this.props.children` 只包含一个 `React element` , 所以只有当 `this.props.children` 是个 `React element` 而不是数组/单个字符串/单个函数才能返回正确的值。 | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,2 @@ | ||
# React.children.forEach | ||
> 使用方式和 React.children.map类似就是没有返回值 |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,18 @@ | ||
# React.children.map | ||
> 遍历props.children可以获取子组件实例,然后clone子组件进行操作,可以添加修改子组件的props如: | ||
```js | ||
React.Children.map(this.props.children, (child) => { | ||
return React.cloneElement(child, { | ||
className: 'xxx', | ||
}); | ||
}) | ||
|
||
React.Children.map(this.props.children, (child, index) => { | ||
if(child.props.active) { | ||
return child; | ||
} | ||
}) | ||
``` | ||
|
||
## 注意: | ||
> `使用this.props.children.map进行遍历如果children是函数/单个react元素/对象等将会抛出错误`,但是使用React.Children.map就不会 |