我声明钩子遵循所有规则,但仍然显示这个错误。 未捕获的错误:无效的钩子调用。 钩子只能在函数组件的主体内部调用。 这可能是由于以下原因之一:
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;
您的身份验证不是一个React组件,它只是一个返回对象的函数。
因此,不能用它来调用它内部的React钩子。
为了被视为React组件,函数必须返回React元素,该元素可以由JSX或React.createElement
生成