提问者:小点点

为什么在Firebase中使用useState钩子是个问题


我声明钩子遵循所有规则,但仍然显示这个错误。 未捕获的错误:无效的钩子调用。 钩子只能在函数组件的主体内部调用。 这可能是由于以下原因之一:

import * as firebase from "firebase/app";
import "firebase/auth";
import firebaseConfig from "../ExternalFunctions/FirebaseConfig";
import { useState } from "react";

firebase.initializeApp(firebaseConfig);

const Auth = () => {
  const [user, setUser] = useState();
  const createNewAccount = (newUser, setNewUser) => {
    firebase
      .auth()
      .createUserWithEmailAndPassword(newUser.email, newUser.password)
      .then(res => {
        console.log(res);
        const { email, displayName } = res.user;
        const userInfo = { email, displayName };
        setUser(userInfo);
        const createdUser = { ...newUser };
        createdUser.error = "";
        setNewUser(createdUser);
        window.location.pathname = "/place-order";
      })
      .catch(err => {
        console.log(err);
        const createdUser = { ...newUser };
        createdUser.error = err.message;
        setNewUser(createdUser);
      });
  };
  const singedInUserAuth = (singInUser, setSingInUser) => {
    firebase
      .auth()
      .signInWithEmailAndPassword(singInUser.email, singInUser.password)
      .then(res => {
        const singedIn = { ...singInUser };
        singedIn.error = "";
        setSingInUser(singedIn);
        console.log(singedIn);
      })
      .catch(err => {
        const singedIn = { ...singInUser };
        singedIn.error = err.message;
        setSingInUser(singedIn);
      });
  };
  console.log(user);
  return {
    user,
    createNewAccount,
    singedInUserAuth
  };
};

export default Auth;

共1个答案

匿名用户

您的身份验证不是一个React组件,它只是一个返回对象的函数。

因此,不能用它来调用它内部的React钩子。

为了被视为React组件,函数必须返回React元素,该元素可以由JSX或React.createElement生成