未处理的拒绝(TypeError):无法读取react-native中未定义的属性“ dispatch”

我在运行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>
        )
    }
}

希望这个问题能尽快解决.. 谢谢。

xin5232823 回答:未处理的拒绝(TypeError):无法读取react-native中未定义的属性“ dispatch”

此问题是由于您尚未在Stack导航器中添加Splash组件,或者如果您尚未添加要调用的位置,那么假设<Splash />忘记了通过导航作为道具。

我建议在堆栈导航器中添加Splash或执行<Splash navigation={this.props.navigation} />

希望它会有所帮助。毫无疑问

本文链接:https://www.f2er.com/2793564.html

大家都在问