React Native useEffect() 未通过 firebase 和 onAuthStateChanged 触发

Question

我有一个使用 React Native 和 Firebase 的应用程序。在 App.js 中，我有一个 useEffect 包装器，观察 onAuthStateChanged 以显示注册/登录或应用程序视图（如果用户对象存在）。

在 registrationView 我有一个

const [userData, setUserData] = useState(null);

const register = useCallback(async () => {
    try{
      await createUserWithEmailAndPassword(auth, email, password)
        .then((registerresponse) => {          
            const user = registerresponse.user.uid;
            setUserData(user);
        })

    } catch(error) {

      /..some error coding.../

      setError(msg);

      console.error(error.message);
    }
  }, [email, password, error, userData]);

还有回调 useEffect 来执行一些数据库工作：

useEffect(() => {
    if (userData) {
      
      try{

        setDoc(doc(db, "user", userData), {
          username: username,
          country: country
        });

        console.log("User Registered");

      }catch(error) {
        console.error(error.message);
      }

    }
  }, [userData]);

我发现的问题是，因为我在 App.js 上有观察者，它在用户对象出现后立即更改视图，所以 RegistrationView 上的 useEffect 永远不会被触发。应用程序立即导航到主屏幕，但数据库工作尚未完成。

所以基本上问题是，如何让 onAuthStateChanged 保持挂起状态，直到 useEffect 完成为止。或者有没有更好的方法来处理路由转换之前作为中间件的注册后工作？

Answer 1

无法延迟调用您的

onAuthStateChanged

回调。

惯用的方法是将用户登录时需要运行的所有代码放入

onAuthStateChanged

回调中。因此，您可以从那里调用

setUserData(user);

，而不是像现在一样从

createUserWithEmailAndPassword

回调中调用。