Lightning コンポーネント開発者ガイド
jlightning:flexipageRegionInfo による Lightning ページコンポーネントでの幅の認識
Lightning アプリケーションビルダーでページの範囲にコンポーネントを追加するときに、lightning:flexipageRegionInfo サブコンポーネントが親コンポーネントにその範囲の幅を渡します。lightning:flexipageRegionInfo といくつかの戦略的 CSS を使用すれば、実行時、範囲ごとに異なる表示で親コンポーネントに表示できます。
たとえば、リストビューコンポーネントは幅認識コンポーネントであるため、小さい範囲と大きい範囲で異なって表示されます。
有効な範囲幅の値は、Small、Medium、Large、Xlarge です。
CSS を使用してコンポーネントをスタイル設定し、コンポーネントが表示される方法を判断できます。次に例を示します。
この単純なコンポーネントには、field1 と field2 の 2 つの項目があります。このコンポーネントが Small の範囲内にない場合、その範囲の幅の 50% を使用して項目が横並びで表示されます。このコンポーネントが Small の範囲内にある場合、その範囲の幅の 100% を使用して項目がリストとして表示されます。
このコンポーネントで使用する CSS ファイルを次に示します。