コントローラ
Reactive Controllerは、単一の機能に関連する状態、動作、ライフサイクルフックをまとめて、サブコンポーネントのコード構成と再利用を可能にするオブジェクトです。
インポート
import { ReactiveController } from 'lit';詳細
コントローラは、addController()メソッドを介して、ホストコンポーネントまたはReactiveControllerHostインターフェースを実装する他のオブジェクトに追加されます。ライフサイクルコールバックの1つ以上を実装することでホストコンポーネントのライフサイクルにフックしたり、ホストでrequestUpdate()を呼び出すことでホストコンポーネントの更新を開始できます。
メソッドとプロパティ
ホストがコンポーネントツリーに接続されたときに呼び出されます。カスタムエレメントホストの場合、これはconnectedCallback()ライフサイクルに対応し、コンポーネントがドキュメントに接続されている場合にのみ呼び出されます。
ホストがコンポーネントツリーから切断されたときに呼び出されます。カスタムエレメントホストの場合、これはdisconnectedCallback()ライフサイクルに対応し、ホストまたは祖先コンポーネントがドキュメントから切断されたときに呼び出されます。
クライアント側のホスト更新中に、ホストが独自の更新を呼び出す直前に呼び出されます。
詳細
update()内のコードは、サーバーサイドレンダリングでは呼び出されないため、DOMに依存できます。
ホストの更新後、ホストがfirstUpdatedとupdatedを呼び出す直前に呼び出されます。サーバーサイドレンダリングでは呼び出されません。
Reactive Controllerをホストし、そのライフサイクルコールバックを呼び出すことができるオブジェクトです。
インポート
import { ReactiveControllerHost } from 'lit';メソッドとプロパティ
ホストが更新を完了したときに解決されるPromiseを返します。Promiseの値は、要素が別の更新をトリガーせずに更新を完了した場合にtrueとなるブール値です。updated()内でプロパティが設定された場合、Promiseの結果はfalseになります。Promiseが拒否された場合、更新中に例外がスローされました。
コントローラをホストに追加します。これにより、コントローラのライフサイクルメソッドがホストのライフサイクルで呼び出されるように設定されます。
パラメータ
- controller
ReactiveController
非同期的に処理されるホストの更新を要求します。更新は、updateCompleteプロパティを介して待機できます。