我尝试使用可按按钮从登录屏幕导航到主屏幕。但是,我现在拥有的代码给出了以下错误:* 找不到导航对象。您的组件是否位于NavigationContainer中?*.错误针对第8行(const navigation = useNavigation();).登录按钮.js:
import React, { Component } from "react";
import { View, Text, Image, Pressable, Button } from "react-native";
import { useNavigation } from "@react-navigation/native";
import styles from "./styles";
import HomeScreen from "../../screens/Home";
const LoginButton = () => {
const navigation = useNavigation();
return (
<View style={styles.container}>
<Pressable
onPress={() => navigation.navigate("Home")}
style={styles.button}
>
<Text style={styles.buttontext}>Login</Text>
</Pressable>
</View>
);
};
export default LoginButton;
LoginButton作为组件插入LoginItem中最后一个〈View.LoginItem.js:
import React from "react";
import { View, Text, Image } from "react-native";
import styles from "./styles";
import LoginButton from "../LoginButton";
import { createNativeStackNavigator } from "@react-navigation/native-stack";
const Stack = createNativeStackNavigator();
const LoginItem = (props) => {
return (
<View style={styles.logincontainer}>
{/* Background image of the login screen */}
<Image
source={require("../../../assets/images/blue-sky-start-screen.jpg")}
style={styles.loginbackground}
blurRadius={4}
></Image>
{/* Title of the login screen */}
<View style={styles.titlecontainer}>
<Text style={styles.companytitle}>BestelSnel</Text>
</View>
{/* Login button */}
<View style={styles.loginbutton}>
<LoginButton></LoginButton>
</View>
</View>
);
};
export default LoginItem;
3条答案
按热度按时间ct2axkht1#
useNavigation
仅在您的组件位于NavigationContainer
和Navigator
内部时有效,如入门页面中所述:https://reactnavigation.org/docs/hello-react-navigation
HomeScreen
将是您的LoginItem
elcex8rz2#
在我的例子中,我得到这个错误是因为autocomplete添加了错误的import语句。
第一个月
但我需要的是
import { useNavigation } from "@react-navigation/native";
希望这能帮助任何人保存一些时间。
gcxthw6b3#
我也正确地传递了params,但是params里面有一个react组件,这就是为什么它会给出这个错误。
//产品不应有React组件props.navigation.navigate(ROUTE_TEST,{产品});