Is it possible to navigate (React-navigation) inside this bottom sheet ?

[Steffi3rd]

Hello guys,

I’m wondering if we can switch screen inside the bottom sheet.

I mean, if I call a screen from the bottom sheet, will be switch inside or close the screen then switch screen ?

Thanks

[BrtqKr]

Not sure if this is what you mean, but if you want to change the main screen (where bottom sheet is placed) you can simply use this.props.navigation.goBack(). Or are you asking for a nested navigation inside the innerContent of the bottom sheet?

[mmoonport]

You can you just need to wrap your navigator in a component and pass the to renderContent and you'll be in the bottom sheet.

const Navigator = createStackNavigator(routes, options);
export const BottomSheetRouter = ({ navigation }) => {
  return <BottomSheetView Navigator={Navigator} navigation={navigation} />;
};

BottomSheetRouteer.router = Navigator.router;

export default BottomSheetRouter;

and in BottomSheetView

const NavigationView = useMemo(
    () => () => {
      return (
        <View
          style={{
            width: "100%",
            height: "100%",
            backgroundColor: vars.backgrounds.darkblue
          }}
        >
          <Navigator navigation={navigation} />
        </View>
      );
    },
    [Navigator, navigation]
  );

<BottomSheet
        renderContent={NavigationView}
        renderHeader={DragHandle}
      />