我在运行react-native应用程序时遇到问题。 问题在Splash.js页面上。 我想在2500秒后移至Login2.js页面 但是,在Splash.js页面出现后,会出现错误:
未处理的拒绝(类型错误):无法读取未定义的属性“ dispatch”
有人可以帮助我克服这个问题吗? 这是脚本
Splash.js:
import React,{ Component } from 'react';
import { Text,View,StyleSheet,StatusBar,TouchableOpacity,Image,Dimensions,Animated } from 'react-native';
import { Stackactions,Navigationactions } from 'react-navigation';
import Wallpaper from '../components/Wallpaper';
export default class Splash extends Component {
constructor(props) {
super(props)
this.state = {
logonyaFade: new Animated.Value(0),tulisanFloat: new Animated.Value(0),width: Dimensions.get('window').width,height: Dimensions.get('window').height,}
Dimensions.addEventListener('change',(e) => {
this.setState(e.window);
});
}
_start = () => {
Animated.timing(this.state.logonyaFade,{
toValue: 1,duration: 1000
}).start();
};
componentWillMount() {
console.disableYellowBox = true;
setTimeout(async () => {
this.props.navigation.dispatch(
Stackactions.reset(
{
index: 0,actions: [
Navigationactions.navigate({ routeName: 'login2' }),]
}))
},2500)
}
render() {
return (
<Wallpaper>
<View style={[styles.bg,{ width: this.state.width }]} onLayout={this._start}>
<Animated.View style={{ opacity: this.state.logonyaFade,width: 200,height: 200,alignSelf: 'center' }}>
<Image style={styles.logoasih} source={require('../images/logo.png')} />
</Animated.View>
<Animated.View style={{ opacity: this.state.logonyaFade }}>
<Text style={styles.textmotto}> "Bring Better Life To The World" </Text>
</Animated.View>
</View>
</Wallpaper>
)
}
}
const styles = StyleSheet.create({
container: {
backgroundColor: '#00BFFF',flex: 1,alignItems: 'center',justifyContent: 'center'
},bg: {
flexDirection: 'column',alignSelf: 'center',imgsplash: {
alignContent: 'center',justifyContent: 'center',},signupTextCont: {
flexGrow: 1,justifyContent: 'flex-end',paddingVertical: 16,flexDirection: 'row'
},signupText: {
color: 'rgba(255,255,0.7)',fontSize: 16,paddingVertical: 30,marginVertical: 30
},signupButton: {
color: '#ffffff',fontWeight: '500'
},logoasih: {
width: 200,textmotto: {
fontSize: 20,color: '#015c6f',fontStyle: 'italic',lineHeight: 43.2,}
});
这是Routes.js中的脚本:
import {Router,Stack,Scene} from 'react-native-router-flux';
import Splash from './pages/Splash';
import Login2 from './pages/Login2';
export default class Routes extends Component{
render(){
return(
<Router>
<Scene key="root" hideNavBar={true} initial={true}>
<Scene key ="splash" component={Splash} title="Splash"/>
<Scene key ="login2" component={Login2} title="Login2"/>
</Scene>
</Router>
)
}
}
希望这个问题能尽快解决.. 谢谢。