動的高さ
ウィンドウスクロールベースのレイアウトで、targetの高さをビューポートとコンテンツの高さに合わせて同期します。
役割
FlexLayoutDynamicHeightは高さが指定されない動的コンテンツのために作業されました。対象要素の 高さと 最小高さ実際のコンテンツの高さとビューポートの基準最小高さを同期させ、ブラウザの ウィンドウ スクロール高さが安定して計算されるようにします。
ボディ高さの同期
このケースでは targetRefを渡さない場合、アンカーの親要素である ボディがターゲットになります。
特定のターゲットの同期
targetRefを渡すと、親ではなくその要素の高さを同期します。ウィンドウスクロールを使用するシェル、ポータルルート、別のドキュメント領域のように高さが指定されていない(自動)動的高さコンテンツで、スクロール高さを安定させる必要がある要素に使用できます。
測定方法
測定時にターゲットの高さを一時的に 自動解除し、 scrollHeightビューポートの高さ、パディング、ボーダー、最後の子のボトムマージンを反映して次の高さと 最小高さを計算します。DOMの変更、リサイズ、visualViewportのリサイズ/スクロール、フォントの読み込み完了時に再測定します。
プロップス
extraHeight
계산된 height에 추가로 더할 값입니다. 기본값은 0입니다.
extraHeightUnit
extraHeight의 단위입니다. px 또는 %를 사용할 수 있으며 기본값은 px입니다.
targetRef
height/minHeight를 동기화할 target element ref입니다. 생략하면 anchor의 parent element를 사용합니다.