[react] [docs] add React.Fragment example to new features

This commit is contained in:
raunofreiberg 2018-03-19 11:05:38 +02:00
parent a209d9ac87
commit ed9ff3ca12
1 changed files with 18 additions and 3 deletions

View File

@ -124,7 +124,7 @@ class Info extends React.Component {
``` ```
{: data-line="6,7"} {: data-line="5,6,7,8,9,10"}
Nest components to separate concerns. Nest components to separate concerns.
@ -422,8 +422,11 @@ New features
------------ ------------
{: .-three-column} {: .-three-column}
### Returning fragments ### Returning multiple elements
You can return multiple elements as arrays or fragments.
**Arrays**
```js ```js
render () { render () {
// Don't forget the keys! // Don't forget the keys!
@ -435,7 +438,19 @@ render () {
``` ```
{: data-line="3,4,5,6"} {: data-line="3,4,5,6"}
You can return multiple nodes as arrays. **Fragments**
```js
render () {
// Fragments don't require keys!
return (
<React.Fragment>
<li>First item</li>
<li>Second item</li>
</React.Fragment>
)
}
```
{: data-line="3,4,5,6,7,8"}
See: [Fragments and strings](https://reactjs.org/blog/2017/09/26/react-v16.0.html#new-render-return-types-fragments-and-strings) See: [Fragments and strings](https://reactjs.org/blog/2017/09/26/react-v16.0.html#new-render-return-types-fragments-and-strings)