react-native - 添加 flex :1 to contentContainerStyle 时 ScrollView 与内容一起消失

Question

当我添加固定高度样式时，它可以工作并且内容在那里，但是当我将它设置为 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> 

另外，如您所见，我有两个 ScrollView 。我指的是最外面的(垂直 ScrollView )。

Answer 1

使用 flex:1 将外部 ScrollView 包装到 View 组件中风格。

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