ReactNativeでログアウト後にログイン画面に戻らない

Question

前提・実現したいこと

ReactNativeでアプリのフロントエンドを作成しています。
ログイン・ログアウトができるのですが、アプリのタスクを切った後にもう一度起動して、
ログアウトをすると、ログイン画面に戻りません。
正常な動きは以下になります。
ログイン画面でログイン→アカウントページに入る→ログアウトする→ログイン画面に戻る

しかし、
ログイン画面でログイン→アカウントページに入る→アプリのタスクを切る→アプリを起動→アカウントページに入る
→ログアウトする→returnで返しているページが表示される
というふうになってしまいます。

該当のソースコード

最初の読み込み画面

const AppNavContainer = ()=>{

    const {authState:{isLoggedIn}} = useContext(GlobalContext);

    const [isAuthenticated, setIsAuthenticated] = useState(isLoggedIn);
    const [authLoaded, setAuthLoaded] = useState(false);

    const getUser = async ()=>{
        try{
            const user = await AsyncStorage.getItem('email');
            if(user){
                setAuthLoaded(true);
                setIsAuthenticated(true);
            }
            else{
                setAuthLoaded(true);
                setIsAuthenticated(false);
            }
        }catch(error){}
    };
    /*
    useEffect(()=>{
        SplashScreen.hide();
    },[]);
    */

    useEffect(()=>{
        getUser();
    }, [isLoggedIn]);

    return (
        <>
        {authLoaded ? (
                <NavigationContainer>

                    {isAuthenticated ? <BottomNavigator />:<AuthNavigator />}
        
                </NavigationContainer>
        ):(
            <ActivityIndicator />
        )}
        </>
    )
}

export default AppNavContainer;

ログアウト画面

const Logout = () => {
  const {authDispatch} = useContext(GlobalContext);

  useEffect(() => {
    logoutUser()(authDispatch);
  }, []);

  return (

  <ActivityIndicator />

  );
};

export default Logout;

logoutUser.js

export default () => dispatch =>{
    AsyncStorage.removeItem('access_token');
    AsyncStorage.removeItem('refresh_token');
    AsyncStorage.removeItem('email');
    dispatch({
        type:'LOGOUT_USER',
    })

}

dispatch type:'LOGOUT_USER'の箇所

      case 'LOGOUT_USER':
        return {
          ...state,
          loading: false,
          data: null,
          isLoggedIn:false,
      }

教えていただければ幸いです。

Comments

[hoshi-takanori]

state の構造は authState の中に isLoggedIn があることになってる気がしますが、dispatch type:'LOGOUT_USER' の処理では state のトップレベルに isLoggedIn: false を設定してるような…。

[shuhei-o]

isLoggedInの初期値をFalseに設定していて、アプリを落とすたびにその初期値になってしまっていたようです、、、

Answer 1

isLoggedInの初期値をFalseに設定していて、アプリを落とすたびにその初期値になってしまっていたようです、、、
アプリを落としてもログインされている場合は、isLoggedInをTrueにしておくことで、ログアウトした時に、isLoggedInがTrueに変わるようになったので、

    useEffect(()=>{
        getUser();
    }, [isLoggedIn]);

ここが正常に機能するようになりました。