他のライブラリでどのように行われているかを例を見てきましたが、私は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
ユーザー認証のステータスが私のサーバー上でチェックされます。
ユーザーが認証されていない場合にアプリケーションの起動時にユーザーのログイン画面が表示されるようにしたいが、理想的には、セッションをサーバー上で削除または期限切れにした場合にユーザーをログインにルーティングするとよいでしょう。
つまり、任意のコード部分からいつでも実行できるようにしたいと考えています。
は、私はのようなコードでこれを行うことができます知っている(userIsLoggedIn
は私のカスタム認証チェック方法である)が、私は、各コンポーネントに手動でこのアクションを実行したくない画面部品の内部
if(!userIsLoggedIn()) {
this.props.navigation.dispatch(
NavigationActions.navigate({routeName: 'Login'}));
}
以下。しかし、私は別の選択肢を持っていないだろう、どこにuserIsLoggedIn()
チェックを入れますか? consructor/componentWillMount/componentWillUpdateの内部では?
UPDATE
私は私が認証を必要とするすべての画面/ルートを指定することができるようになる解決策を期待。
私はいくつかのカスタムルールでここでルートを使用しなければならないようです。 しかし、標準ルータには2種類あります:TabRouterとStackRouterです。私は3レベルのナビゲーション明らか
StackNavigator
LoginScreen
RegisterScreen
AboutScreen
FirstLevelTabNavigator
Tab1: AccountScreen
Tab2: SecondLevelTabNavigator
Tab1Screen
Tab2Screen
Tab3Screen
を持っているつもりです
、ログイン、登録およびについて画面は、認証を必要としませんが、アカウントにアクセスしようとする試みで、Tab1Screen、Tab2ScreenまたはTab3Screenユーザーが必要LoginScreenにリダイレクトされます。
各ナビゲータに3台のルータを今すぐ構築する必要がありますか?
私はちょうど同じusecaseを持っています、上記の質問に対する答えを見つけましたか? userIsLoggedInをどこに置くか、カスタムルーターを構築しましたか? – Jeremie
こんにちは、他のアプリエリアに切り替えました。一時的な解決策として、各アプリの起動時にログイン画面に移動します。 – gumkins