使用 Expo + React 导航 5 的 Firebase 身份验证流程

时间:2021-01-14 02:24:44

标签: reactjs firebase react-native expo react-navigation

我正在尝试使用 React Navigation v5 在 Expo 中设置 Firebase 身份验证,但遇到了一些困难。根据我所阅读的内容,我正在尝试在我的 App.js 中设置导航,如下所示:

const App = () => {
  const [isLoading, setIsLoading] = useState(true);
  const [user, setUser] = useState(null);

  useEffect(() => {
    firebase.auth().onAuthStateChanged((user) => {
      if (user != null) {
        setUser(user);
        setIsLoading(false);
      }
    });
  }, []);

  return (
  <NavigationContainer>
    {isLoading ? (
      <LoadingScreen />
    ) : user ? (
      <MainTabScreen />
    ) : (
      <AuthStackScreen />
    )}
  </NavigationContainer>
  );
};

其中 LoadingScreen 显示 ActivityIndi​​cator,MainTabScreen 返回包含主应用程序的标签导航器,AuthStackScreen 返回带有登录和注册屏幕的堆栈导航器。目前我收到错误 Error: Invalid hook call. Hooks can only be called inside of the body of a function component,但我怀疑我当前的身份验证导航流程存在更深层次的问题。

谁能提供任何资源来概述如何使用 Firebase、React Navigation 5 和 Expo 来实现这个基本流程?

0 个答案:

没有答案