Scroll content inside @gorhom/bottom-sheet - React Native

Question

I am trying to implement a Comments Section inside a Bottom Sheet (@gorhom/bottom-sheet). The problem I am facing is that when I try to scroll the content (comments), it doesn't work, and instead the bottom sheet collapses.

Here is what I tried :

      <BottomSheet
        ref={bottomSheetRef}
        index={0}
        snapPoints={snapPoints}
        onChange={handleSheetChanges}
      >
        <View style={styles.contentContainer}>
          <Text>{comments} Comments</Text>
          <Comments />
        </View>
      </BottomSheet>

Answer 1

In order to make your View scrollable, you need to use a ScrollView component. However, it will be needed to import it from 'react-native-gesture-handler' instead of the 'react-native' one.

You can get more information in this GitHub discussion.

Answer 2

Use import { ScrollView } from 'react-native-gesture-handler' instead of from 'react-native'