路由到登錄屏幕的反應本機的情況下，用戶未經過身份驗證

我見過很多示例如何與其他庫完成，但我使用react-navigation之一，需要一個解決方案。路由到登錄屏幕的反應本機的情況下，用戶未經過身份驗證

這裏是一個代碼示例：

const MainTabs = TabNavigator({ 
    Profile: { screen: ProfileScreen }, 
    Home: { screen: HomeScreen }, 
}); 

const RootNavigator = StackNavigator({ 
    Main: { screen: MainTabs }, 
    Login: { screen: LoginScreen }, 
},{ 
    initialRouteName: "Login", 
    headerMode: "none", 
}); 

export default RootNavigator;

完整的應用程序代碼，您可以在這裏找到：https://snack.expo.io/Hy8IXWppg

用戶認證狀態是我的服務器上檢查。

我想讓用戶在應用程序啓動時呈現登錄屏幕，以防用戶未通過身份驗證，但理想情況下，如果用戶的會話在服務器上被刪除/過期，最好將用戶路由到登錄。

換句話說，我希望能夠隨時從任何代碼部分做到這一點。

我知道我可以用代碼來完成它像下面

if(!userIsLoggedIn()) { 
    this.props.navigation.dispatch(
     NavigationActions.navigate({routeName: 'Login'})); 
}

的屏幕組件內（其中userIsLoggedIn是我的自定義身份驗證檢查方法），但我不希望在每個組件手工執行此操作。但即使我不會有另一種選擇，在哪裏把userIsLoggedIn()檢查？內部consctructor/componentWillMount/componentWillUpdate？

UPDATE

我期望的解決方案，它可以讓我指定所有屏幕/線路需要認證。

在我看來，我必須使用一些自定義規則的路線。但是有兩種標準路由器：TabRouter和StackRouter。

我將有3個級別的導航

StackNavigator 
    LoginScreen 
    RegisterScreen 
    AboutScreen 
    FirstLevelTabNavigator 
     Tab1: AccountScreen 
     Tab2: SecondLevelTabNavigator 
      Tab1Screen 
      Tab2Screen 
      Tab3Screen

顯然，登錄，註冊和關於畫面不需要身份驗證，但在試圖訪問的帳戶，Tab1Screen，Tab2Screen或Tab3Screen用戶必須被重定向到LoginScreen。

現在我應該爲每個導航器構造3個路由器嗎？

來源

2017-04-13 gumkins

嗨gumkins，我有完全相同的用例，你有沒有找到上述問題的答案？在哪裏放置userIsLoggedIn，並且您是否構建自定義路由器？ – Jeremie

嗨，不，我已經切換到其他應用領域了。作爲臨時解決方案，我正在導航到每次應用發佈時的登錄屏幕。 – gumkins

我認爲你應該有另一個屏幕，這將是你的第一個屏幕。這可以是一個簡單的組件，它只是一個ActivityIndicator。在這一點上，你應該檢查你的服務器，並相應地導航。

Ex。 InitialComponent

componentWillMount() { 

    getStatus(this.navigate.bind(this)) 
} 

navigate(loggedIn) { 
    this.setState({animating: false}); 
    if(loggedIn) { 
     navigate to Main 
    } else { 
     navigate to Login 
    }  
    } 

render() { 
    return(<View> <ActivityIndicator animating={this.state.animating}/> </View>); 

}

這也將有一個顯示你的用戶，你正在處理的東西，把它們放在（例如，如果請求需要時間）之前的好處。

來源

2017-04-13 14:43:49

路由到登錄屏幕的反應本機的情況下，用戶未經過身份驗證

回答

相關問題