我是新来的响应本机的人,我在实现启动屏幕时遇到了一些困难,因此我想向大家展示一下,也许有人会有所帮助。
我收到该错误。但目前我真的不知道我在哪里犯错,我的代码看起来像这样
App.js
import {
createAppContainer,
createSwitchNavigator,
createDrawerNavigator
} from 'react-navigation';
import Splashscreen from './components/Splashscreen';
import Login from './components/Login'
const HomeNavigator = createDrawerNavigator({
Splash: Splashscreen,
Home: Login,
});
const RouteConfigs = {
SplashScreen: {
screen: Splashscreen
},
Home: {
screen: Login
}
};
const AppNavigator = createSwitchNavigator(
RouteConfigs,
{
initialRouteName: "SplashScreen"
}
);
现在我的启动画面代码如下:
Splashscreen.js
import React, { Component } from 'react';
import { Platform, StyleSheet, Text, View, Image , ActivityIndicator, Dimensions, Modal } from 'react-native';
export default class Splashscreen extends Component{
componentDidMount()
{
setInterval(() => {
this.props.navigation.navigate('Login')
}, 4000);
}
render(){
return(
<View style={styles.container}>
<Image
source={{uri: 'http://peopleweb.freeasphost.net/d4b0e7d1-6c0e-4e48-a4cb-0f1c26af81fe_200x200.png'}}
style={styles.logo} />
</View>
);
}
}
const styles = StyleSheet.create({
container:{
flex: 1,
justifyContent :"center",
alignItems:"center"
},
logo:{
width:150,
height:150
},
});
以及稍后将重定向的登录页面
Login.js
import React, { Component } from 'react';
import { Platform, StyleSheet, Text, View , TextInput, TouchableOpacity} from 'react-native';
export default class Login extends Component{
render(){
return(
<View style={styles.container}>
<TextInput
placeholder = "Username"
style={styles.input}
/>
<TextInput
placeholder = "Password"
style={styles.input}
/>
<TouchableOpacity style={styles.button} onPress={this.login}>
<Text style={styles.loginbtn}> Login </Text>
</TouchableOpacity>
</View>
);
}
}
const styles = StyleSheet.create({
container:{
flex: 1,
justifyContent :"center",
alignItems:"center"
},
input:{
width:200,
margin:10
},
button:{
width:200,
padding:10,
backgroundColor:'#009999',
alignItems: 'center'
},
loginbtn:{
color:'#ffff'
}
});
我确实需要有关我在做什么的指南。错误可能是什么?我是新来的