mirror of https://github.com/yewstack/yew
29 lines
1.5 KiB
Plaintext
29 lines
1.5 KiB
Plaintext
---
|
|
title: '紹介'
|
|
description: 'Yew のコンポーネント'
|
|
---
|
|
|
|
## コンポーネントとは？
|
|
|
|
コンポーネントは Yew の構成要素です。内部状態を管理し、要素を DOM にレンダリングできます。`Component` トレイトを実装することでコンポーネントを作成します。
|
|
|
|
## コンポーネントマークアップの作成
|
|
|
|
Yew は仮想 DOM を使用して要素を DOM にレンダリングします。仮想 DOM ツリーは `html!` マクロを使用して構築できます。`html!` の構文は HTML に似ていますが、同じではありません。ルールもより厳格です。また、条件付きレンダリングやイテレータを使用したリストのレンダリングなどの強力な機能も提供します。
|
|
|
|
:::info
|
|
[`html!` マクロ、その使用方法、および構文についてさらに詳しく知る](concepts/html/introduction.mdx)
|
|
:::
|
|
|
|
## コンポーネントにデータを渡す
|
|
|
|
Yew コンポーネントは _props_ を使用して親コンポーネントと子コンポーネント間で通信します。親コンポーネントは任意のデータを props として子コンポーネントに渡すことができます。Props は HTML 属性に似ていますが、任意の Rust 型を props として渡すことができます。
|
|
|
|
:::info
|
|
[props についてさらに詳しく知る](advanced-topics/struct-components/properties.mdx)
|
|
:::
|
|
|
|
:::info
|
|
親/子通信以外の通信には、[コンテキスト](../../concepts/contexts.mdx) を使用してください
|
|
:::
|