Nested Navigator not working about react-native-curved-bottom-bar HOT 12 CLOSED

hi @buscanopaul ,
You can refer to Ex:

import React, { useImperativeHandle } from 'react';
import { View } from 'react-native';
import { styles } from './styles';

export const HomeScreen = React.forwardRef((props, ref) => {
  useImperativeHandle(ref, () => {
    return { reload: reload };
  });

  const reload = () => {
    // Events
  };

  return <View style={styles.main} />;
});

You get curentRef then call reload function.

from react-native-curved-bottom-bar.

You cannot pass inside a stack of react-navigation. replace by a single component.
Using "const { navigate } = useNavigation()" to navigate inside

from react-native-curved-bottom-bar.

Hi @hoaphantn7604, Thank you for your response.

My main issue was I can't reset the nested stack navigator or go back to initial route stack navigator when I click again the bottom navigation icon (home). Please refer screenshot below

In the screenshot Instead of click the back button to reset the nested stack navigator. I want to reset it when I click the home icon again. Just like the default react navigation bottom tab behavior.

Here's my app.js
<NavigationContainer> <TabNavigator /> </NavigationContainer>

In my TabNavigator.js. I'm just using the Example 1 template just replace View with my stack navigator component
<CurvedBottomBar.Screen name="Home" position="left" component={({ navigate }) => ( <HomeStackNavigator /> )} />

My HomeStackNavigator.js
<Stack.Screen name="Home" component={HomeScreen} />
<Stack.Screen name="Transactions" component={TransactionsScreen} />

I hope you understand. Thank you

from react-native-curved-bottom-bar.

I have the same problem as you, but I don't have a solution, I hope someone can help me, thank you.

from react-native-curved-bottom-bar.

https://github.com/hoaphantn7604/react-native-template-components
You can refer to the way that I navigate.

from react-native-curved-bottom-bar.

Hi @hoaphantn7604, Do you have unmountOnBlur options on the CurvedBottomBar.Screen? I want to reset the stack navigator every time I want to click the bottom icons.

Example:
<CurvedBottomBar.Screen name="Home" position="left" component={({ navigate }) => ( <HomeStackNavigator /> )} // unmountOnBlur={true} // options={{unmountOnBlur: true}} />

from react-native-curved-bottom-bar.

Hi @hoaphantn7604, Do you have unmountOnBlur options on the CurvedBottomBar.Screen? I want to reset the stack navigator every time I want to click the bottom icons.

Example: <CurvedBottomBar.Screen name="Home" position="left" component={({ navigate }) => ( <HomeStackNavigator /> )} // unmountOnBlur={true} // options={{unmountOnBlur: true}} />

Hi @buscanopaul,
Can you describe your request in more detail?

from react-native-curved-bottom-bar.

Cant add more than 3 CurvedBottomBar.Screen

from react-native-curved-bottom-bar.

This issue has been resolved in version 2.0.0.

from react-native-curved-bottom-bar.

@hoaphantn7604 Mr Admin! Kindly help me to solve the issue.
i want more detailed answer for issue raised by @buscanopaul. Instead of click the back button to reset the nested stack navigator. I want to reset it when I click the home icon again. Just like the default react navigation bottom tab behavior.
this is one of the issue i hassle to use this library but i love this library can you add default navigation behaviour reset the nested stack navigator thankyou

from react-native-curved-bottom-bar.

@hoaphantn7604 Mr Admin! Kindly help me to solve the issue. i want more detailed answer for issue raised by @buscanopaul. Instead of click the back button to reset the nested stack navigator. I want to reset it when I click the home icon again. Just like the default react navigation bottom tab behavior. this is one of the issue i hassle to use this library but i love this library can you add default navigation behaviour reset the nested stack navigator thankyou

Hi, have you managed to fix this, or find a workaround ?

from react-native-curved-bottom-bar.

from react-native-curved-bottom-bar.