react-native - 反应本机导航错误。我该如何解决这个问题?
问题描述
在这段代码中,我想使用 navigation.navigate 在主屏幕和配置文件屏幕之间切换。但是当我运行该应用程序时,我收到以下错误:找不到变量导航。我一直在寻找解决方案,但似乎找不到。这是代码:
import 'react-native-gesture-handler';
import * as React from 'react';
import {View, Text, Button} from 'react-native';
import { NavigationContainer, StackActions } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';
const Stack = createStackNavigator();
const HomeScreen = () => {
return(
<View>
<Text>Home Screen</Text>
<Button title="Go to Profile Screen" onPress={()=> navigation.navigate("Profile")}/>
</View>
);
}
const ProfileScreen = () => {
return(
<View>
<Text>Profile Screen</Text>
<Button title="Go to Home Screen" onPress={() => navigation.navigate("Home")}/>
</View>
);
}
export default function App() {
return (
<NavigationContainer>
<Stack.Navigator>
<Stack.Screen
name="Profile"
component={ProfileScreen}
options={{ title: '' }}
/>
<Stack.Screen
name="Home"
component={HomeScreen}
/>
</Stack.Navigator>
</NavigationContainer>
);
}
先感谢您。
解决方案
您可以从中获取navigation
对象props
。代码示例:
const HomeScreen = ({navigation}) => {
return(
<View>
<Text>Home Screen</Text>
<Button title="Go to Profile Screen" onPress={()=> navigation.navigate("Profile")}/>
</View>
);
}
推荐阅读
- javascript - 在ajax post call中下载文件
- php - 如何修复语法错误意外'C'?
- node.js - 比较MongoDB中的两个数组?
- javascript - 使动态生成的按钮默认隐藏
- python - Python - 在 HTML 中搜索和替换分解的文本
- mysql - Flyway 5.1.0 及更高版本不支持以“--”开头但不后跟空格的 SQL 单行注释
- python-3.x - 我的二分搜索有问题吗?
- html - CSS下拉子菜单问题
- python-2.7 - 在python 3中加载hickle文件(来自python2)
- java - 表格行中的切换按钮未注册点击事件