React Native 实现注销登录功能

**

React Native 实现注销登录功能

**

1. 使用Navigation导航时，注销功能实现

（1）、使用Navigation的dispatch和reset，但是局限性很大，如果注销界面和登录界面不在一个stack中，reset会有问题。（这种方法一般用在登录界面跳到主界面）。

//登录界面跳Tab界面，防止回退登录界面，当然你也可以写监听方法
const resetAction = NavigationActions.reset({
    index: 0,
    actions: [
        NavigationActions.navigate({ routeName: 'Tab' })
    ]
});
//button处的单击事件。
 () => {
                            navigate('Tab');
                                this.props.navigation.dispatch(resetAction);
                        }
                        }>
                        {STRING.login}
 

（2）、跳转+Back键监听事件，从当前界面就做普通跳转到登录界面+登录界面加上backhandler监听事件+退出应用方法。
当然这种方法，还有个问题，当从注销界面跳转到登录界面时，导航器中会出现“箭头”；

//注销界面的navigation跳转
 <Button block style={StyleSheet.flatten(styles.button_default)}
     onPress={() => { navigate('Login') }}><Text style={StyleSheet.flatten(styles.exittext)} >注销Text>
 Button>

//登录界面中的back键监听方法；
export default class page_login extends Component {
    componentDidMount() {
        BackHandler.addEventListener('hardwareBackPress', function () {
            BackHandler.exitApp();
                        return true;
              });
      }
    render() {

/**
*在注册登录界面navigation时，传入navigationoptions；navigation与navigator不   同的是*去箭头的参数为headerLeft:null;而navigator是header{Left:null}
*/

const navigationOptions = {
    headerTitle: STRING.appname,
    headerTitleStyle: {
        color: 'black',
        textAlign: 'center',
        alignSelf: 'center',
    },
    headerLeft:null
}

const MOOCNavigator = StackNavigator({
    Login: { screen: LoginPage, navigationOptions: navigationOptions },
    Tab: { screen: TabNavigator, navigationOptions: { header: null } },
}, {

    });

export default MOOCNavigator;

2. 使用Navigator导航，注销功能实现

如果我们是用Navigator实现的导航，则可以借助于onDidFocus和immediatelyResetRouteStack两个方法实现。

刚学RN，瞎捣鼓，功能虽然实现了，也许有更好的办法。。，如果哪位大神，有更好的方法，还望跟大家分享下。