Skip to content

Commit 7964690

Browse files
authored
Update ru/guide/v10/typescript.md (#1366)
1 parent ec1aecc commit 7964690

1 file changed

Lines changed: 26 additions & 0 deletions

File tree

content/ru/guide/v10/typescript.md

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -205,6 +205,32 @@ class Expandable extends Component<ExpandableProps, ExpandableState> {
205205

206206
Классовые компоненты по умолчанию включают дочерние элементы, типизированные как `ComponentChildren`.
207207

208+
## Типизация дочерних элементов
209+
210+
`ComponentChildren` — это тип, представляющий все допустимые дочерние элементы в Preact. Он включает примитивные типы, такие как `string`, `number` и `boolean`, а также элементы Preact, значения `null`/`undefined` и массивы из всего вышеперечисленного. Для тех, кто знаком с React, он работает очень похоже на `ReactNode`.
211+
212+
```tsx
213+
import { h, ComponentChildren } from 'preact';
214+
215+
interface MyHeadingComponentProps {
216+
children: ComponentChildren;
217+
}
218+
219+
function MyHeadingComponent({ children }: MyHeadingComponentProps) {
220+
return <h1>{children}</h1>;
221+
}
222+
223+
<MyHeadingComponent>
224+
{/* Примеры валидных дочерних элементов */}
225+
Привет, мир!
226+
<strong>Жирный текст</strong>
227+
{42}
228+
{true}
229+
{['Массив', '', 'строк']}
230+
<OtherComponent />
231+
</MyHeadingComponent>
232+
```
233+
208234
## Наследование свойств HTML
209235

210236
Когда мы пишем компоненты, такие как `<Input />`, которые оборачивают HTML-элемент `<input>`, чаще всего мы хотим унаследовать свойства, которые могут быть использованы на нативном HTML-элементе input. Для этого мы можем сделать следующее:

0 commit comments

Comments
 (0)