Блог

Я работаю над сенсорным экраном с помощью onPress, чтобы перейти к экрану под названием «Экран входа», но это не работает … (onPress={() =gt; навигация.навигация(«Экран входа»)}) Эта ошибка типа Ошибка: неопределенный не является объектом (оценка «навигация.навигация»). Пожалуйста, помогите мне решить эту проблему. Я много чего натворил, но все равно не могу это исправить.

ИМПОРТ

 import React, { useState } from 'react'; import { LinearGradient } from 'expo-linear-gradient'; import { useTheme } from '@react-navigation/native'; import MaterialIcons from 'react-native-vector-icons/MaterialIcons'; import { ImageBackground, StyleSheet, View, Image, Text, TextInput, Button, TouchableOpacity, Dimensions, StatusBar, Animated } from 'react-native'; import * as Animatable from 'react-native-animatable';  

 const WelcomeScreen = ({navigation}) =gt; {  return (  lt;View style={styles.container}gt;  lt;View style={styles.header}gt;  lt;Animatable.Image   animation="bounceIn" duration={1500} source={require('../assets/logo1.png')} style={styles.logo} resizeMode="stretch"/gt;  lt;/Viewgt;  lt;Animatable.View style={styles.footer} animation="fadeInUpBig"gt;  lt;Text style={styles.title}gt;Stay connected with everyone!lt;/Textgt;  lt;Text style={styles.text}gt;Sign in with accountlt;/Textgt;  lt;View style={styles.button}gt;  lt;TouchableOpacity onPress={() =gt; navigation.navigate('SignInScreen')}gt;  lt;LinearGradient colors={['#d60939', '#ad022a']} style={styles.signIn} title="Go to SignInScreen"gt;  lt;Text style={styles.textSign}gt;Get Startedlt;/Textgt;  lt;MaterialIcons name="navigate-next" color="#fff" size={20}/gt;  lt;/LinearGradientgt;  lt;/TouchableOpacitygt;  lt;/Viewgt;  lt;/Animatable.Viewgt;  lt;/Viewgt;  ); }  const {height} = Dimensions.get("screen"); const height_logo = height * 0.28;  const styles = StyleSheet.create({  background: {  flex: 1,  justifyContent: "flex-end",  alignItems: 'center',  },  container: {  flex: 1,   backgroundColor: '#cfcfcf'  },  loginButton: {  width: '100%',  height: 60,  backgroundColor: '#242222',  },  registerButton: {  width: '100%',  height: 60,  backgroundColor: '#0d0c0c',  },  logo: {  width: height_logo,  height: height_logo,  },  button: {  alignItems: 'flex-end',  marginTop: 30  },  header: {  flex: 2,  justifyContent: 'center',  alignItems: 'center'  },  footer: {  flex: 1,  backgroundColor: '#fff',  borderTopLeftRadius: 30,  borderTopRightRadius: 30,  paddingVertical: 50,  paddingHorizontal: 30  },  logoContainer: {  position: 'absolute',  top: '20%',  alignItems: 'center',  },  title: {  color: '#05375a',  fontSize: 30,  fontWeight: 'bold'  },  text: {  color: 'grey',  marginTop:5  },  signIn: {  width: 150,  height: 40,  justifyContent: 'center',  alignItems: 'center',  borderRadius: 50,  flexDirection: 'row'  },  textSign: {  color: 'white',  fontWeight: 'bold'  },  apptitle: {  fontWeight: "bold",  color: 'white',  textShadowColor: 'rgba(0, 0, 0, 0.75)',  textShadowOffset: {width: -1, height: 1},  textShadowRadius: 10,  padding: 5,  borderRadius: 10,  fontSize: 40,  letterSpacing: 10,  },  info: {  fontWeight: "bold",  color: 'white',  top: 20,  borderRadius: 10,  fontSize: 20,  textAlign: 'center',  },  logindetails: {  width: '70%',   height: 60,   backgroundColor: 'white',   textAlign: 'center',  borderRadius: 50,  margin: 5,  color: 'black',  bottom: '27%',  }, })   export default WelcomeScreen;     

выход

 Uncaught Error: undefined is not an object (evaluating 'navigation.navigate')  

Пою на экране то, в чем я хочу ориентироваться

 import React from 'react' import { View, Text, Button, StyleSheet } from 'react-native'  const SignInScreen = () =gt; {  return (  lt;Viewgt;  lt;Textgt;SignInSreenlt;/Textgt;  lt;Button title="Click Here" onPress={() =gt; alert('Button Clicked!')}/gt;  lt;/Viewgt;  ) }  export default SignInScreen;  const styles = StyleSheet.create({  container: {  flex: 1,  alignItems: 'center',  justifyContent: 'center'  }, })  

разрушьте навигацию на экране входа и повторите попытку

  const SignInScreen = ({navigation}) =gt; {  return (  lt;Viewgt;  lt;Textgt;SignInSreenlt;/Textgt;  lt;Button title="Click Here" onPress={() =gt; alert('Button Clicked!')}/gt;  lt;/Viewgt;  ) }