Firebase Auth v9: Object(..)不是函数

Question

我需要帮助，我正在看firebase和react教程。然后我意识到这个教程是针对v8的最新的版本是v9

这是我的firebase.js

import { initializeApp } from 'firebase/app';
import { getAuth } from 'firebase/auth';
import { getDatabase } from "firebase/database";
const firebaseConfig = {
//firebaseconfig
};
const app = initializeApp(firebaseConfig);
const auth = getAuth(app);
const database = getDatabase(app);
export { auth, database }

然后这是我的signing。js代码片段

import { auth, database } from "../Firebase/firebase";
const submitForm = async (values) => {

auth()
.signInWithEmailAndPassword(values.email,values.password)
.then((userCredentials) => {
props.history.push("/profile");
}).catch((err) => {  
setLoading(false);
});
};

，然后当我提交我的表单应用程序崩溃错误在身份验证().

Unhandled Rejection (TypeError): Object(...) is not a function

Answer 1

import { auth, database } from "../Firebase/firebase";
// this  ^^^^ is not a function but is being used as one
// auth().signInWithEmailAndPassword(values.email,values.password)
// ^^^^ here

signInWithEmailAndPassword需要从firebase/auth中导入，如下所示:

import { auth, database } from "../Firebase/firebase";
import { signInWithEmailAndPassword } from "firebase/auth"
const submitForm = async (values) => { 
const userCredentials = await signInWithEmailAndPassword(auth, values.email, values.password)
// Pass the 'auth' instance here                         ^^^^
const { user: { uid } } = userCredentials
console.log(`userId: ${uid}`)
}

我建议在任何教程中都遵循文档。该文档具有名称间隔(v8)和模块化/功能(v9)语法。