私はコンポーネント階層を持っています
<Component1>
<Component2>
<Component3>
<Image
....
>
</Component3>
</Component2>
<Component1>
Component1 と Component2 にはある程度の高さがあります。
親コンポーネントの高さに関係なく、それぞれ高さのある 3 つのコンポーネントにネストされた画像をフルスクリーンで表示するにはどうすればよいですか?
イメージを flex:1 として指定すると、イメージを全画面表示したいのに、Component3 のフレックスボックスで調整されます。
現在、私の画像スタイルは次のとおりです。
image: {
position: 'absolute',
top: 0,
left: 0,
right: 0,
bottom: 0,
},
サイズ変更モードは「カバー」に設定されています
そのコンテナ (Component3) スタイル:
container: {
alignItems: 'center',
justifyContent: 'center',
},