1

我的应用程序有一个登录屏幕,当我登录系统时,它显示主屏幕,用户可以切换选项卡以更改屏幕。但是现在,如果我点击“历史记录”,它将返回登录屏幕,如何处理? 在此处输入图像描述

在此处输入图像描述

这是我的路线配置:

const MainScreen = TabNavigator({
    Map:{ screen: Map},
    History:{ screen:History},
});
export const AppNavigator = StackNavigator(
    {
        Main: { screen: MainScreen },
    Login: { screen: LoginScreen },
},
    {
        headerMode:'screen',
    }
);


const AppWithNavigationState = ({dispatch, nav}) => {
    return (
        <AppNavigator navigation={addNavigationHelpers({ dispatch, state: nav })} 
/>  
    );
};


AppWithNavigationState.propTypes = {
    dispatch: PropTypes.func.isRequired,
    nav: PropTypes.object.isRequired,
};

const mapStateToProps = state => ({
    nav: state.nav,
});

export default connect(mapStateToProps)(AppWithNavigationState);

功能导航(状态=初始导航状态,动作){

switch (action.type) {

    case LOGIN:{
        console.log('excute login operator ......',);
        return  AppNavigator.router.getStateForAction(NavigationActions.reset({
            index: 0,
            actions: [
                NavigationActions.navigate({ routeName: 'Main'})
            ]
        }), state);
    }
    case LOGOUT:
        console.log('excute logout operator ......');
        return initialNavState;
    default:
        return initialNavState;
}
}

我发现了问题。如果我点击登录进入Tab界面,reducer会触发两次,一次是LOGIN,一次是默认。我认为默认是选项卡操作。那么如何处理嵌套的 TabNavigator 中的 tab 动作呢?

4

1 回答 1

3

这是 Github https://github.com/parkerdan/SampleNavigation中带有 redux 的 tabNavigator 示例,希望对您有所帮助。

于 2017-04-25T11:47:19.643 回答