React native 将flex:1添加到contentContainerStyle时，ScrollView将与内容一起消失

当我添加一个固定高度的样式时，它会工作，并且内容在那里，但是当我将其设置为flex:1（正确的方式）时，scrollview会随着内容一起消失

我的代码：

<ScrollView contentContainerStyle={{flex:1}} showsVerticalScrollIndicator={false}>
          <View style={{padding: 5}}>
            <Text>search</Text>
          </View>
          <View style={{padding: 5}}>
            <Text>New Matches</Text>
            <ScrollView contentContainerStyle={{flex:1}} horizontal={true} showsHorizontalScrollIndicator={false}>
              <View style={{padding: 10}}>
                <Thumbnail medium circle source={require('../assets/placeholders/profile1.jpg')}/>
                <Text>Christian</Text>
              </View>
              <Text>works</Text>
              <Text>works</Text>
              <Text>works</Text>
              <Text>works</Text>
              <Text>works</Text>
            </ScrollView> 

搜索
新比赛
基督教的
作品
作品
作品
作品
作品

---

另外，正如您所看到的，我有两个滚动视图。我指的是最外层（垂直滚动视图）。

将外部滚动视图包装为具有

flex:1

样式的视图组件

<View style={{flex: 1}>
  <ScrollView contentContainerStyle={{flex:1}} showsVerticalScrollIndicator={false}>
...
  </ScrollView>
</View>

...

一般的想法是为包含滚动视图的容器提供足够的高度（我称之为

滚动容器

）（这也意味着为

滚动容器的父容器提供足够的高度

）。由于子对象的高度限制为父对象的高度，因此如果在

滚动容器上指定
flex:1
，如果父对象没有足够的空间，它也将消失。