ScrollView Not Scrolling in small view height in react native答案

【问题标题】：ScrollView Not Scrolling in small view height in react nativeScrollView Not Scrolling in small view height in react native
【发布时间】：2020-04-10 23:08:16
【问题描述】：

我正在开发一个 react native 项目，但我的 scrollView 在小视图高度上不起作用。这是我的代码。

<View style={{height: 300}}>
    <ScrollView>
        <View>
            ...
        </View>
        <View>
            ...
        </View>
        ...
    </ScrollView>
</View>

请问可能是什么问题？

更新

我添加了更多样式以进一步解释... scrollView 位于底部表react-native-raw-bottom-sheet 中，这是代码中看到的 RBSheet。 scrollView 不滚动。有什么事吗？

    <View>
      <RBSheet
        ref={ref}
        closeOnDragDown={true}
        closeOnPressMask={true}
        height={500}
        customStyles={{
          draggableIcon: {
            backgroundColor: Colors.light,
          },
          container: {
            borderTopLeftRadius: 16,
            borderTopRightRadius: 16,
          },
        }}>
        <View style={{flex: 1}}>
            <View style={{padding: 16}}>
                <View style={{height:300}}>
                  <ScrollView showsVerticalScrollIndicator={true}>
                    <View
                      style={[
                        FlexDirections.row,
                        JustifyContent.spaceBetween,
                        {paddingVertical: 8},
                      ]}>
                      <Text style={FontWeight.bold}>Name</Text>
                      <Text>Jane doe</Text>
                    </View>
                    ...

                  </ScrollView>
                </View>
            </View>
        </View>
      </RBSheet>
    </View>

【问题讨论】：

它应该可以工作，你能展示你的整个渲染吗？（+ 风格）
@CR7 我已更新问题以显示更多上下文

标签： reactjs react-native react-native-android react-native-ios

【解决方案1】：

您可以将 closeOnDragDown 设置为 false。

如果您需要 closeOnDragDown 为真，您可以尝试在 ScrollView 之后直接添加一个 TouchableOpacity ，如下所示：

   <ScrollView showsVerticalScrollIndicator={true}>
      <TouchableOpacity activeOpacity={1}>
        <View
          style={[
            FlexDirections.row,
            JustifyContent.spaceBetween,
            { paddingVertical: 8 },
          ]}>
          <Text style={FontWeight.bold}>Name</Text>
          <Text>Jane doe</Text>
        </View>
      </TouchableOpacity>
    </ScrollView>

【讨论】：