在2个屏幕之间反应本机导航

Question

我是react native的新手，我不明白为什么它不起作用在我的主文件App.js中，我需要一个按钮来转到另一个屏幕(AddList.js(所以，在app.js中，我有function App (navigation) {const onPressHandler = () => {navigation.navigate('AddList')}return (<Pressable onPress={onPressHandler}>}

function addList(navigation) {const onPressHandler = () => {navigation.goBack();}return(<NavigationContainer><Stack.Navigator><Stack.Screenname="Home"component={App}/><Stack.Screenname="FavProducts"component={FavProducts}/>

</Stack.Navigator>
</NavigationContainer>
)

}

在同一个文件中有App.js

很抱歉有这个问题，感谢您的帮助

我尝试过重新激活文档，但没有使用

Answer 1

如果使用@react navigation/natur，则首先需要创建容器来处理组件状态，然后必须创建堆栈在堆栈的侧面，您需要像这样定义屏幕。

import React from 'react';
import { NavigationContainer } from "@react-navigation/native";
import { createStackNavigator } from "@react-navigation/stack";
import AddList from './components/screens/AddList';
const Stack = createStackNavigator();
const App = () => {
return (
<NavigationContainer>
<Stack.Navigator>
<Stack.Screen
component={AddList}
name="AddList"
options={{ headerShown: false }}
/>
// define your screens as well
</Stack.Navigator>

</NavigationContainer>
);
};
export default App;

如果你必须从一个屏幕移动到另一个屏幕，那么导入到你的js文件中，在那里你必须创建点击事件

import { useNavigation } from '@react-navigation/native';
const navigation = useNavigation();

按下按钮

navigation.navigate('AddList')