|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
import * as React from 'react' const Child = props => ( <div>{props.children}</div> ) const Parent = props => ( <Child> aaaaaaaaa </Child> ) export default Parent |
以上のようなソース。
Childコンポーネントの中に、props.childrenという記述があります。
reactを書いていると頻出する記法なのですが、この記述の意味は、親Componentのタグの間に入れられた要素を表示するという意味です。
上のソースの例で言うと、親コンポーネントでChildタグでaaaaaという文字列をネストしているので、export defaultしたParentをブラウザで表示すると、
【aaaaaaa】
という表示がされます！
Vue.jsでいう<slot>のようなものですね！
