reactjs - How can I use one bottomsheet in many screen Gorhom bottomsheet React Native? - Stack Overflow

I want to use one bottom sheet and I am using useMemo, i tried forwardRef but it didn't work as I have to call same bottomsheet in almost 7-8 screen.

Tried to save ref in Zustand store globally using createRef or {current:null}. It works in one screen only but if I come back to the screen and want to reopen, the sheet ref becomes null.

const handleCloseModalPress = () => {
        bottomSheetModalRef?.current?.close();
    };

    const handleRevealPress = () => {
        handleCloseModalPress()
        navigation.navigate('MainSearch')}

Can someone help? I have tried many things but it's still not working

I want to use one bottom sheet and I am using useMemo, i tried forwardRef but it didn't work as I have to call same bottomsheet in almost 7-8 screen.

Tried to save ref in Zustand store globally using createRef or {current:null}. It works in one screen only but if I come back to the screen and want to reopen, the sheet ref becomes null.

const handleCloseModalPress = () => {
        bottomSheetModalRef?.current?.close();
    };

    const handleRevealPress = () => {
        handleCloseModalPress()
        navigation.navigate('MainSearch')}

Can someone help? I have tried many things but it's still not working

• reactjs
• react-native
• react-navigation
• tabnavigator

Share Follow edited Feb 3 at 16:18 Hamed Jimoh 1,40388 silver badges2020 bronze badges asked Jan 29 at 17:15 ZeeshanZeeshan 1841313 bronze badges 1

• Have you tried the useBottomSheet hook? gorhom.dev/react-native-bottom-sheet/hooks#usebottomsheet – PhantomSpooks Commented Jan 30 at 0:55

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 0

You can create two custom hooks, one for creating a new drawer and returning its ref, and the other one for using it via drawer's id.