Проп children — это специальный React проп, который позволяет передавать компоненты и контент как данные другим компонентам, как и любой обычный проп. Весь контент, размещённый между открывающим и закрывающим тегами компонента, автоматически становится доступным как this.props.children.
Когда ты вкладываешь элементы или компоненты внутрь пользовательского компонента, React передаёт этот контент компоненту как проп children. Это позволяет гибко комбинировать компоненты, где родительские компоненты могут определять контент своих дочерних элементов.
Проп children особенно полезен для:
React предоставляет несколько утилит для работы с пропом children:
React.Children.map() — пройти по children и преобразовать ихReact.Children.forEach() — пройти по children без возврата значенийReact.Children.count() — подсчитать количество childrenReact.Children.only() — проверить, что есть ровно один childReact.Children.toArray() — преобразовать children в массивconst MyDiv = ({ children }) => {
return <div>{children}</div>;
};
ReactDOM.render(
<MyDiv>
<span>Hello</span>
<span>World</span>
</MyDiv>,
document.getElementById('root')
);
В этом примере два элемента <span> передаются как children компоненту MyDiv и отображаются внутри <div>.
Пропс children в React автоматически заполняется любым контентом, размещённым между открывающим и закрывающим тегами компонента, без необходимости явной передачи пропса.
Новый — ещё не проверен сообществом
Вы