Skip to content

Commit e819a0e

Browse files
committed
1 parent 508c5ae commit e819a0e

File tree

1 file changed

+27
-0
lines changed

1 file changed

+27
-0
lines changed

src/guide/render-function.md

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -567,6 +567,33 @@ render () {
567567
}
568568
```
569569

570+
## Return Values for Render Functions
571+
572+
In all of the examples we've seen so far, the `render` function has returned a single root VNode. However, there are alternatives.
573+
574+
Returning a string will create a text VNode, without any wrapping element:
575+
576+
```js
577+
render() {
578+
return 'Hello world!'
579+
}
580+
```
581+
582+
We can also return an array of children, without wrapping them in a root node. This creates a fragment:
583+
584+
```js
585+
// Equivalent to a template of `Hello<br>world!`
586+
render() {
587+
return [
588+
'Hello',
589+
h('br'),
590+
'world!'
591+
]
592+
}
593+
```
594+
595+
If a component needs to render nothing, perhaps because data is still loading, it can just return `null`. This will be rendered as a comment node in the DOM.
596+
570597
## JSX
571598

572599
たくさんの `render` 関数を書いていると、こういう感じのものを書くのがつらく感じるかもしれません:

0 commit comments

Comments
 (0)