![](/img/trans.png)
[英]I am getting the error; "'navigation.navigate' is undefined " or navigation.navigate is not a method (react native)
[英]How do I solve react native navigation.navigate error
这是我第一次使用本机反应,我想移动到另一个屏幕(slide2),我有一个错误,上面写着“Undefined is not an object (evaluating navigation.navigate)”我有点卡住了,这就是我有多远走了。 也请解释一下,我将不胜感激,并告诉我要添加什么以及在哪里添加,谢谢
slideOne.js页面代码
import 'react-native-gesture-handler';
import {NavigationContainer} from '@react-navigation/native';
import {createStackNavigator} from '@react-navigation/stack';
import React from 'react';
import SlideTwo from './SlideTwo';
import {
SafeAreaView,
StyleSheet,
ScrollView,
View,
Text,
StatusBar,
TextInput,
Button,
} from 'react-native';
import {
Header,
LearnMoreLinks,
Colors,
DebugInstructions,
ReloadInstructions,
} from 'react-native/Libraries/NewAppScreen';
function SlideOne({navigation}) {
return (
<React.Fragment>
<View style={styles.body}>
<View style={styles.wrapper}>
<View style={styles.imageWrap}></View>
<TextInput
placeholder="What should we refer to you as?"
placeholderTextColor="#03444F60"
style={styles.textInput}
underlineColorAndroid="transparent"
/>
</View>
<View style={styles.label}>
<Text style={styles.labelText}>First Name</Text>
</View>
<View style={styles.textWrap}>
<Text style={styles.text}>Back</Text>
<Text style={styles.text}>Next</Text>
</View>
<Button
title="Go to screen two"
onPress={() => navigation.navigate('SlideTwo')}
/>
</View>
</React.Fragment>
);
}
export default SlideOne;
这是我的 index.js 路由所在的位置
import 'react-native-gesture-handler';
import {NavigationContainer} from '@react-navigation/native';
import {createStackNavigator} from '@react-navigation/stack';
import {AppRegistry} from 'react-native';
import App from './App';
import SlideOne from './SlideOne';
import SlideTwo from './SlideTwo';
import {name as appName} from './app.json';
AppRegistry.registerComponent(appName, () => SlideOne);
app.js 代码
import React from 'react';
import {createStackNavigator} from '@react-navigation/stack';
import {NavigationContainer} from '@react-navigation/native';
import SlideOne from './SlideOne';
import SlideTwo from './SlideTwo';
// NAVIGATION
const StackNavigator = createStackNavigator();
function App() {
<NavigationContainer>
<StackNavigator.Navigator>
<StackNavigator.Screen name="SlideOne" component={SlideOne} />
<StackNavigator.Screen name="SlideTwo" component={SlideTwo} />
</StackNavigator.Navigator>
</NavigationContainer>;
}
export default App;
你的index.js文件不正确只是用这个替换index.js文件
import 'react-native-gesture-handler';
import {NavigationContainer} from '@react-navigation/native';
import {createStackNavigator} from '@react-navigation/stack';
import {AppRegistry} from 'react-native';
import App from './App';
import {name as appName} from './app.json';
AppRegistry.registerComponent(appName, () => App);
您应该将App注册为 AppRegistry 组件,而不是注册SlideOne
你没有初始化你的“导航”常量。 试试这个:- 从 @react-navigation/native 导入 useNavigation
import { useNavigation } from '@react-navigation/native';
并像这样初始化你的导航常量
const navigation = useNavigation();
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.