Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6287

Navigation between screens with nested Navigation

$
0
0

Having a bit of trouble getting to navigate between screens in the nested navigation (Tabs and screens). Here is my code:

This is the Tab Stack navigator

const AppStack = () => {  return (<Tab.Navigator    initialRouteName="Scan"    screenOptions={{      headerShown: false,      tabBarActiveTintColor: 'red',      tabBarInactiveTintColor: 'black',    }}><Tab.Screen name="Market" component={MarketplaceScreen} options={{          tabBarLabel: 'Marketplace',          tabBarIcon: ({ focused, color, size }) => (<Icon                name="shopping"                size={24}                color={focused ? color : 'black'}              />          ),        }} /><Tab.Screen name="Discover" component={DiscoverScreen} options={{          tabBarLabel: 'Discover',          tabBarIcon: ({ focused, color, size }) => (<Icon                name="map-search"                size={24}                color={focused ? color : 'black'}              />          ),        }} /><Tab.Screen name="Wallet" component={WalletScreen} options={{          tabBarLabel: 'Wallet',          tabBarIcon: ({ focused, color, size }) => (<Icon                name="wallet"                size={24}                color={focused ? color : 'black'}              />          ),        }} /><Tab.Screen name="Account" component={AccountScreen} options={{          tabBarLabel: 'Account',          tabBarIcon: ({ focused, color, size }) => (<Icon                name="account"                size={24}                color={focused ? color : 'black'}              />          ),        }} /></Tab.Navigator>  );

This is the Screen Stack:

  function App() {    return (<NavigationContainer><Stack.Navigator><Stack.Screen            name="Profile"            component={ProfileScreen}/></Stack.Navigator></NavigationContainer>    );  }

This is how I set up the Account Screen:

  function AccountScreen(navigation:any) {      return (<View style={styles.container}><TouchableOpacity onPress={() =>navigation.navigate('Profile') }><Text>PRESS HERE </Text></TouchableOpacity></View>

The error I keep getting is "navigation.navigate is not a function"

Any help is welcome, I'm just out of ideas at the moment, Thank you


Viewing all articles
Browse latest Browse all 6287

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>