在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 方法中的参数是你在导航器中定义的屏幕名称,确保你在导航器中正确定义了屏幕名称。