Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/android/208.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Android 在组件之间导航将重新加载导航器路由中的所有组件_Android_React Native_React Redux_React Navigation - Fatal编程技术网

Android 在组件之间导航将重新加载导航器路由中的所有组件

Android 在组件之间导航将重新加载导航器路由中的所有组件,android,react-native,react-redux,react-navigation,Android,React Native,React Redux,React Navigation,我在某个地方读到,当您使用react-navigation包中的任何导航器时,如果您实现了redux;导航器路线中的每个组件都将重新加载(即组件将接收道具) 但是,我有两个用户可以登录的页面 export const MainScreenTabNavigator = TabNavigator({ Start: { screen: Start, navigationOptions: { title: 'Start',

我在某个地方读到,当您使用
react-navigation
包中的任何导航器时,如果您实现了redux;导航器路线中的每个组件都将重新加载(即
组件将接收道具

但是,我有两个用户可以登录的页面

export const MainScreenTabNavigator = TabNavigator({
    Start: {
        screen: Start,
        navigationOptions: {
            title: 'Start',
        },
    },
},{
    tabBarPosition: "bottom",
    tabBarOptions: {
        activeTintColor: '#222',
        labelStyle: {
            color: '#ddd',
        },
        style: { backgroundColor: '#333' },
    }
});

export const AppNavigator = StackNavigator({
    Main: {
        screen: MainScreenTabNavigator, // Nested tab navigator
    },
    Login: {
        screen: Login,
        navigationOptions: {
            title: 'Aanmelden',
        }
    },
    Camera: {
        screen: AppCamera,
        navigationOptions: {
            title: 'Camera',
        }
    }

}, {
    mode: 'modal',
    headerMode: 'none',
});
登录屏幕最初显示给用户。它有一个表单,用户可以手动输入凭证,还有一个按钮可以导航到摄像头,用户可以在其中扫描带有登录凭证的二维码

在这两种情况下,用户都会发送登录操作。 登录页面和相机页面都会侦听相同的道具更改:

componentWillReceiveProps(nextProps) {
    if (nextProps.account.loginSuccess) {
        this.props.navigation.dispatch(NavigationActions.navigate({ routeName: 'Start' }));
    } else {
        if (nextProps.account.loginError) {
            Toast.showLongBottom(nextProps.loginError);
        }
    }
    this.setState({spinnerVisible: false});
}
应用程序成功导航到“开始”,但当它导航到“开始”时,登录页面和相机页面都被重新加载,导致无限循环进入
组件WillReceiveProps
,并一次又一次无限导航到“开始”

这是我的导航减速器:

function nav(state = initialNavState, action) {
    const nextState = AppNavigator.router.getStateForAction(action, state);

    // Simply return the original `state` if `nextState` is null or undefined.
    return nextState || state;
}
我能做些什么来防止这种行为?

作为临时解决方案,我在导航状态中引入了另一个布尔值:

function nav(state = initialNavState, action) {
    let nextState = null;

    if (action.type === 'Navigation/NAVIGATE' && action.routeName === 'Start') {
        nextState = {...AppNavigator.router.getStateForAction(action, state), authenticated: true};
    } else {
        nextState = AppNavigator.router.getStateForAction(action, state);
    }

    // Simply return the original `state` if `nextState` is null or undefined.
    return nextState || state;
}
我使用
authenticated
检查登录或摄像头组件是否应在登录后导航至启动

它起作用了,但我还是觉得我错过了什么