-
-
Notifications
You must be signed in to change notification settings - Fork 921
Description
Bug
I'm rendering a FlatList of items where each has a button that triggers the bottom sheet to come up to display. After presenting itself, the backDropComponent becomes active.
However, when I scroll through the items in the FlatList, I get an error indicating null is not an object (evaluating "containerRef.current.setNativeProps).
This is the error below. After tracing it, it seems to be coming from the BottomSheetBackDrop.tsx file.
For some context, I just upgraded from bare workflow Expo project from SDK v40 to v41. Interestingly, I wasn't having this issue when using SDK v40. After upgrading to v41, I downgraded the react-native-reanimated and react-native gesture-handler to versions 1.13.2 and 1.8.0, respectively.
Environment info
| Library | Version |
|---|---|
| @gorhom/bottom-sheet | ^2 |
| react-native | 0.64.2 |
| react-native-reanimated | ^1.13.2 |
| react-native-gesture-handler | 1.8.0 |
Steps To Reproduce
Below is how I had completed the installation instructions for the @gorhom/react-native-bottom-sheet library.
npm install --save @gorhom/bottom-sheet@^2npm install --save react-native-reanimated@^1 react-native-gesture-handlercd ios && pod install
Describe what you expected to happen:
- I expected to scroll through the FlatList without the error showing, just like how it was previously working in Expo SDK 40.
Reproducible sample code
Below is the code for how I'm implementing the bottom sheet:
<BottomSheet
ref={this.sheetRef}
index={-1}
snapPoints={this.state.snapPoints}
onChange={this.handleSheetChange}
enableTouchThrough={false}
backdropComponent={(backdropProps) => (
<BottomSheetBackdrop
{...backdropProps}
enableTouchThrough={false}
/>
)}
>
<BottomSheetScrollView
contentContainerStyle={styles.contentContainer}
showsVerticalScrollIndicator={false}
>
</BottomSheetScrollView>
</BottomSheet>