在React Native应用中使用 navigation.navigate
可以通过以下步骤完成:
react-navigation
库,可以使用以下命令进行安装:npm install @react-navigation/native
NavigationContainer
组件,并将其包裹在你的应用的根组件之外。例如:import { NavigationContainer } from '@react-navigation/native';
function App() {
return (
{/* Your app's components */}
);
}
export default App;
Stack Navigator
),并将其导航器组件嵌套在 NavigationContainer
组件中。例如:import { createStackNavigator } from '@react-navigation/stack';
const Stack = createStackNavigator();
function App() {
return (
{/* Your app's screens */}
);
}
export default App;
props.navigation
访问到导航对象,然后使用 navigate
方法进行页面导航。例如:import React from 'react';
import { Button } from 'react-native';
function HomeScreen({ navigation }) {
return (
在上面的例子中,当按钮被点击时,navigate
方法被调用,将导航到名为 'Details'
的屏幕。
请注意,navigation.navigate
方法中的参数是你在导航器中定义的屏幕名称,确保你在导航器中正确定义了屏幕名称。