here is my AppNavigator.js
const StackNavigator = createStackNavigator(
{
LoginScreen: LoginScreen,
RegisterScreen: RegisterScreen,
Tabs:Tabs,
Detail:DetailScreen
},
{
initialRouteName: 'LoginScreen',
headerMode: 'none',
});
export default createAppContainer(StackNavigator)
here is my Tabs.js
<Tab.Navigator
tabBarOptions={{
showLabel: false,
style:{
position: 'absolute',
bottom:5,
left:5,
right:5,
elevation:0,
backgroundColor: '#068b71',
borderRadius:10,
height: 50,
...styles.shadow
}
}}>
<Tab.Screen name="Home" component={HomeScreen}
options={{
tabBarIcon:({focused})=>(
<View style={{alignItems:'center', justifyContent:'center'}}>
<Image source={require('../assets/icons/home.png')}
resizeMode='contain'
style={{
width:25,
height:25,
tintColor: focused ? '#ffffff' : '#748c94'
}}/>
<Text style={{color: focused ? '#ffffff' : '#748c94', fontSize:10}}>Home</Text>
</View>
)
}} >
</Tab.Screen>
<Tab.Screen name="Profile" component={ProfileScreen}
options={{
tabBarIcon:({focused})=>(
<View style={{alignItems:'center', justifyContent:'center'}}>
<Image source={require('../assets/icons/profile.png')}
resizeMode='contain'
style={{
width:25,
height:25,
tintColor: focused ? '#ffffff' : '#748c94'
}}/>
<Text style={{color: focused ? '#ffffff' : '#748c94', fontSize:10}}>Profile</Text>
</View>
)
}} />
</Tab.Navigator>
and i want to navigate from list view that exist in homeScreen
<TouchableOpacity style={styles.item} onPress={()=>{navigation.navigate('Detail')}}>
i got this error : The action 'NAVIGATE' with payload {"name":"Detail"} was not handled by any navigator. itry many solution but none of them work help please im stuck.