Я пытаюсь перейти на другой экран внутри компонента, но при этом обнаружил некоторые проблемы.
Во-первых, у меня есть «навигация. js», где находятся все мои ссылки, например :
function HomeChild(){
return(
<Stack.Navigator>
<Stack.Screen
name="Home"
component={Home}
options={({navigation}) => ({
title: "Home",
headerStyle:{
backgroundColor: "lightblue"
}
})}
/>
</Stack.Navigator>
)
}
export default function Navigation({navigation}){
return(
<Tab.Navigator
...
>
<Tab.Screen
name="Home"
children={HomeChild}
options={{
tabBarLabel: "Home",
tabBarIcon: ({ color }) => (
<MaterialIcons name="home" color={color} size={25}/>
)
}}
/>
</Tab.Navigator>
)
}
Приложение. js
(очевидно, у меня есть больше ссылок, но некоторые удалены, так как они примерно такие же)
render(){
const detail = 1
// if(this.state.firstLaunch === null){
if(detail == 0){
return null
}
// else if(this.state.firstLaunch == true){
else if(detail == 1){
return(
<FirstLoad /> //<-- THIS is the one I'm gonna navigate from
)
}
else{
return(
<NavigationContainer>
<Navigation />
</NavigationContainer>
)
}
}
И это компонент, в котором я хочу выполнить навигацию
function submitButtonTapped({username, navigation}){
// const navigation = useNavigation()
navigation.navigate("Home") //Crashing on this.
}
export default function FirstLoad({ navigation }){
return(
{/* I removed some unnecessary code for this */ }
<TouchableOpacity style={styles.submitButton} onPress={() => submitButtonTapped({username, navigation})}>
<Text style={styles.submitButtonText}>Submit</Text>
</TouchableOpacity>
)
}
Итак, есть ли какой-либо способ навигации из этого? Если да, то как я могу это сделать?