嵌套ScrollView如何在React Native中扩展到其高度的100％？

Question

我有一个用于用户配置文件的主ScrollView，然后在该ScrolllView中调用一个组件，该组件也是具有相同垂直方向的ScrollView。

我正在扩展嵌套组件，因此其高度为其中内容的100％。当前，高度似乎在屏幕的高度附近，而其中的内容似乎更长。

我目前拥有的代码如下：

<ScrollView style={{ flex: 1 }} contentContainerStyle={{ marginTop: HEADER_MAX_HEIGHT, paddingBottom: HEADER_MAX_HEIGHT * 1.5 }}>   

     ...irrelevant code here

     {showSub && <Sub uid={uid} /> }

</ScrollView>

其中Sub的定义大致如此，我从此示例中删除了一些不必要的代码：

<ScrollView style={{ flex: 1 }}
            contentContainerStyle={{ marginTop: 0, paddingBottom: 0 }}
            scrollEventThrottle={2}
            onScroll={this.onScroll} 
            refreshControl={<RefreshControl refreshing={refreshing} onRefresh={this.onRefresh} />}
      > 

      ...irrelevant code here

            <View>
                    {categories && Object.keys(categories).map((category, catIndex) => {
                        let currentCategory = categories[category]
                        let collections = currentCategory['data']
                        let categoryName = currentCategory['categoryName']

                        return (
                            <View key={category}>
                                <TouchableOpacity style={{ flex: 1 }} onPress={() => this.props.navigation.navigate('Category', { category })}>
                         <Text style={{ flex: 1, fontSize: 28, fontWeight: 'bold', marginTop: 15, marginLeft: generalPadding }}>
                               {categoryName}
                         </Text>
                   </TouchableOpacity>
            </View>)}
                </View>
            </ScrollView>

我已经为ScrollView尝试了height: "100%"，但是没有达到所需的高度。

Answer 1

Welp，我能够通过将内容包装在高度为100％的视图中来解决此问题。