如何在反应导航应用程序中授权用户？

问题描述：

1）AuthorizedScreens

2）一旦NotAuthorizedScreens

的应用程序加载我要检查，如果用户登录或不？如果用户已登录，则该应用加载AuthorizedScreens，如果不是，则加载NotAuthorizedScreens。我如何实现这一目标？我已经包含的示例，但不是可用的代码，但我想这就是它的可能性！

App.js

import React from 'react'; 
import { AsyncStorage } from 'react-native'; 
import { Provider } from 'react-redux'; 
import { DrawerNavigator, StackNavigator } from 'react-navigation'; 
import store from './store'; 

export default class App extends React.Component { 

    async componentWillMount() { 
    const token = await AsyncStorage.getItem('facebook_token'); 
    } 

    render() { 

    const AuthorizedScreens = DrawerNavigator(... 

    const NotAuthorizedScreens = DrawerNavigator(... 


    return (
     <Provider store={store}> 
     { (this.token) ? <AuthorizedScreens /> : <NotAuthorizedScreens /> } 
     </Provider> 

    ); 
    } 
}

注意！ 我有一个行动的创建者，检查用户是否登录。但我不能把它连接到应用成分，因此我决定用AsyncStorage来存储facebook_token，如果存在令牌是指用户登录，如果没有用户不...

"dependencies": { 
    "expo": "^20.0.0", 
    "react": "16.0.0-alpha.12", 
    "react-native": "https://github.com/expo/react-native/archive/sdk-20.0.0.tar.gz", 
    "react-navigation": "^1.0.0-beta.11", 
    "react-redux": "^5.0.6", 
    "redux": "^3.7.2", 
    "redux-thunk": "^2.2.0" 
    }

答

我已经解决了这个问题componentWillMount设置状态和回报调用它。

import React from 'react'; 
import { AsyncStorage } from 'react-native'; 
import { Provider } from 'react-redux'; 
import { DrawerNavigator, StackNavigator } from 'react-navigation'; 
import store from './store'; 

export default class App extends React.Component { 
    state = { 
    login_token: '', 
    }; 

    async componentWillMount() { 
    const token = await AsyncStorage.getItem('facebook_token'); 
    this.setState({ login_token: token }); 
    } 

    render() { 

    const AuthorizedScreens = DrawerNavigator(... 

    const NotAuthorizedScreens = DrawerNavigator(... 


    return (
     <Provider store={store}> 
     { (this.state.login_token) ? <AuthorizedScreens /> : <NotAuthorizedScreens /> } 
     </Provider> 

    ); 
    } 
}

我已经解决了这个问题，但我不知道我是否以正确的方式做到了！因为，Redux负责我的状态管理，但是我通过设置状态手动使用了反应状态管理。

如果您知道更好方式，我将不胜感激。

如何在反应导航应用程序中授权用户？

相关推荐