Я сделал домашний экран для своего приложения с помощью React-Native и вернулся к реализации Stack Navigator, чтобы я мог начать на следующем экране.
Отображается это сообщение об ошибке:
Я сузил это до чего-то не так с моим домашним экраном, который я сделал, может кто-нибудь помочь мне выяснить, где я иду не так?
Экран приложения
import React from 'react';
import { View, Text, Button } from 'react-native';
import createAppContainer from 'react-navigation';
import createStackNavigator from 'react-navigation-stack';
//Component Screens
import Home from './Home/Home.js';
const AppNavigator = createStackNavigator(
{
Home: { screen: Home }
},
);
const App = createAppContainer(AppNavigator);
export default App;
Главный экран
import React, {Component} from 'react';
import { StyleSheet, Text, View, ImageBackground,
Image, TextInput, Dimensions, Platform } from 'react-native';
import BackgroundCarousel from './components/Login_Screen/BackgroundCarousel.js'
import Button_login from './components/Login_Screen/button_login.js'
import Button from './components/Login_Screen/button.js'
const images = [
require("./images/Login_Images/basketball.jpg"),
require("./images/Login_Images/network.jpg"),
require("./images/Login_Images/memories.jpg"),
require("./images/Login_Images/photographer.jpg")
];
/* Logo for login page */
import logo from './Icon/iconpersons.png'
const { width: WIDTH } = Dimensions.get('window')
const Home = ({navigation}) => {
return (
<View style= {styles.carouselContainer}>
<BackgroundCarousel images={images}>
<View style={styles.logoContainer}>
<Image source={logo} style={styles.logo}/>
<Text style={styles.logoText}>Hello World</Text>
</View>
<Button style= {styles.button}>
Let's Get Started
</Button>
<Button_login></Button_login>
</BackgroundCarousel>
</View>
);
}
const styles = StyleSheet.create({
carouselContainer: {
height: "100%",
width: "100%",
backgroundColor: '#fff',
flex: 1
},
logoContainer:{
zIndex: 2,
alignItems: 'center',
position: 'absolute',
justifyContent: "center",
top: 0, left: 0, right: 0, bottom: 450
},
logo: {
zIndex: 2,
width: 125,
height:125,
},
logoText: {
zIndex: 2,
color: 'white',
fontSize: 25,
fontWeight: '500',
borderColor: 'white',
//fontFamily: "ProximaNova-Regular",
},
button: {
flex: 1,
zIndex: 2,
}
});
export default Home
РЕДАКТИРОВАТЬ: я пытаюсь сделать мою домашнюю страницу первой, которая появляется, когда я загружаю свое приложение. Он работал до того, как я реализовал стековую навигацию, и теперь я просто получаю ошибки. Мне любопытно, правильно ли используется
const Home = ({navigation}) => {
на домашнем экране?