コンポーネントの構成
コードの再利用性とメンテナンス性を高めるため、一連の小さなコンポーネントを使用してアプリケーションとコンポーネントを構成すると便利です。lightning 名前空間には、コンポーネントの構築に使用できる lightning-button などの基本コンポーネントが多数含まれています。
コンポーネントで構成された簡単なアプリケーションを見てみましょう。このマークアップは、_オーナー_と_コンテナ_の概念を示すことを考慮して作成されたものです。実際のアプリケーションでは、c-todo-item インスタンスの数は可変であり、for:each ループで動的に入力されます。
- オーナー
オーナーは、テンプレートを所有するコンポーネントです。この例では、オーナーは
c-todo-appコンポーネントです。オーナーは、含まれているすべての構成コンポーネントを制御します。オーナーは次のことができます。- 構成コンポーネントの公開プロパティを設定する。
- 構成コンポーネントでメソッドをコールする。
- 構成コンポーネントによって起動されるイベントをリスンする。
- コンテナ
コンテナには他のコンポーネントが含まれますが、コンテナ自体はオーナーコンポーネントに含まれます。この例では、
c-todo-wrapperはコンテナです。コンテナはオーナーよりも強力ではありません。コンテナでは、次のことができます。- 含まれているコンポーネントの公開プロパティを読み取る (ただし変更は不可)。
- 構成コンポーネントでメソッドをコールする。
- 含まれているコンポーネントによって上に伝達されるいくつかの (すべてとは限らない) イベントをリスンします。
- 親と子
あるコンポーネントに別のコンポーネントが含まれている (同様にこれにも他のコンポーネントを含むことができる) 場合、コンテインメント階層があります。ドキュメント内で親コンポーネントと子コンポーネントに言及することがあります。親コンポーネントには子コンポーネントが含まれます。親コンポーネントは、オーナーの場合もあれば、コンテナの場合もあります。
関連トピック