当访问另一个堆栈导航器时，反应导航不起作用

Question

我对反应导航有问题。这是我的导航代码。

Navigation.js

const StartStack = createStackNavigator({
    First: EmptyScreen,
    Splash: SplashScreen 
},
{
    transitionConfig: () => fromBottom(),
});
const AppStack = createStackNavigator({
    Home: TabSet
},
{
   transitionConfig: () => fromRight(),
});
const AuthStack = createStackNavigator({ 
   SignIn: SignInScreen,
   SignUp: SignUpScreen,
   ForgotPassword: ForgotPasswordScreen
},
{
    transitionConfig: () => fromTop(),
});

export default createAppContainer(createSwitchNavigator({
   Start: StartStack,
   Auth: AuthStack,
   App: AppStack,
},
{
  initialRouteName: 'Start',
}));

Tabset.js

import React , { Component } from 'react';
import { View } from 'react-native';
import * as navOptions from '../../navigate/navigationOptions';
import BackgroundImage from '../../components/BackgroundImage';

class TabSet extends Component{

    static navigationOptions = { headerStyle: navOptions.headerStyle};

    render(){
        return(
            <View>
                <BackgroundImage>
                </BackgroundImage>
            </View>
        );
    }
}

export default TabSet;

NavigationOptions.js

export const headerStyle = {
    display:'none'
}

BackgroundImage.js

import React , { Component } from 'react';
import { View , ImageBackground , StyleSheet } from 'react-native';
import backgroundImage from '../../assets/images/backgroundImage.png';

class BackgroundImage extends Component{
    render(){
        return(
            <View>
                <ImageBackground 
                    source={backgroundImage} 
                    style = {styles.bgImg}
                    imageStyle = {{resizeMode : 'stretch'}}>
                        {this.props.children}
                 </ImageBackground>
            </View>
        )
     }
 }
 const styles = StyleSheet.create({
  bgImg : {
    width: '100%',
    height: '100%'
  }
 })
 export default BackgroundImage;

我创建了三个堆栈，例如AppStack，StartStack和AuthStack。这些用于 createAppContainer（） 函数，希望按原样访问这些

  

this.props.navigation.navigate（'App'）

...我可以访问

  

this.props.navigation.navigate（'开始'）

和

  

this.props.navigation.navigate（'Auth'）

。这两个堆栈很好用。然后，我使用

Authp 从 AuthStack 的 SignIn 屏幕路由到 AppStack

  

this.props.navigation.navigate（'App'）

我看到AppStack的第一页，显示 Home 屏幕，然后突然回到 AuthStack的SignIn 屏幕。然后，我尝试再次导航，同样的事情再次发生。我使用redux并进行redux集成导航。因为我认为这是一个redux问题。但是问题仍然存在。一切正常，但是每次导航到 AppStack 时，它都会回到 AuthStack 。任何人都可以解决，请帮助我！

Answer 1

花了几个小时后，我明白了问题所在！

setInterval(()=>{
  ***...some process***
  }else{
    clearInterval(this);
    this.props.navigation.navigate('Auth');
  }
},500);

此代码写在初始屏幕中。我认为间隔已清除。但实际上并不清楚，我尝试进入AppStack，每隔500毫秒返回一次Auth。上面的代码是旧代码，我不记得了！