#reactjs #redux
#реагирует на #возвращение
Вопрос:
У меня настроено собственное приложение React, и я использую react-navigator для защиты маршрутов:
// navigator.ts ... export default function Navigator() { const user = useAppSelector(selectCurrentUser) return ( lt;NavigationContainergt; lt;MainStack.Navigatorgt; {!user ? ( lt;gt; lt;MainStack.Screen name="Auth" component={AuthScreen} /gt; lt;/gt; ) : ( lt;gt; lt;MainStack.Screen name="EditProfile" component={EditProfileScreen} /gt; lt;/gt; )} lt;/MainStack.Navigatorgt; lt;/NavigationContainergt; ) }
// editProfileScreen.ts ... export default function EditProfileScreen() { const user = useUser(); const dispatch = useAppDispatch(); const handleLogout = () =gt; { dispatch(logout()) } return ( lt;Viewgt; lt;EditProfileForm user={user}/gt; lt;Button onPress={handleLogout}gt;Logoutlt;/Buttongt; lt;/Viewgt; ) }
// useUser.ts export default function useUser() { const user = useAppSelector(selectCurrentUser) if (!user) { throw new Error('You may not use the useUser hook when the user is not available.') } return user }
Причина, по которой у меня есть этот крючок пользователя, заключается в том, что я могу использовать безопасный для типа способ доступа к пользователю, поскольку он гарантированно присутствует в компонентах/экранах, в которых я его использую.
К сожалению, при нажатии кнопки выхода useUser.ts
из системы появляется сообщение об ошибке. Похоже, что react-navigator все еще отображает экран редактирования, хотя он должен отображаться только в том случае, если доступен пользователь.