Firebase身份验证当前用户使用 typescript 时出错

fzsnzjdm  于 2023-03-04  发布在  TypeScript
关注(0)|答案(1)|浏览(155)

在使用firebase配置typescript时,我收到以下错误:Argument of type 'User | null' is not assignable to parameter of type 'User'. Type 'null' is not assignable to type 'User'.

    • 错误在这里:auth. currentUser**我不清楚它是什么类型。
updateProfile(auth.currentUser, {
                    displayName: name
                }

完整代码:

import { getAuth, createUserWithEmailAndPassword, signOut, onAuthStateChanged, signInWithEmailAndPassword, updateProfile } from "firebase/auth";
import { useEffect, useState } from "react";
import FirebaseInitialization from "../Firebase/Firebase.init";


FirebaseInitialization()

interface IUseFirebaseProps {
}

const UseFirebase: React.FunctionComponent<IUseFirebaseProps> = (props) => {
    const [user, setUser] = useState({})
    const [error, setError] = useState('')
    const [admin, setAdmin] = useState(false)
    const [isLoading, setIsLoading] = useState(true)
    const auth = getAuth()

      // REGISTER WITH EMAIL AND PASSWORD
      const RegisterUser = (email: string, password:string, name:string, history: any) => {
        setIsLoading(true)
        createUserWithEmailAndPassword(auth, email, password)
            .then((userCredential) => {
                const newUser = { email, displayName: name };
                setUser(newUser);
                setError('')
                updateProfile(auth.currentUser, {
                    displayName: name
                }).then(() => {
                }).catch((error) => {
                });
                history.replace('/');
            })
            .catch((error) => {

                const errorMessage = error.message;
                setError(errorMessage)
            }).finally(() => setIsLoading(false));
    }
  return <h2>Firebase</h2>
};

export default UseFirebase;

我该怎么解决这个问题,有人能帮我吗?

xzv2uavs

xzv2uavs1#

auth.currentUser的值可以是null。在这种情况下,您可以直接从UserCredential对象传递User对象。请尝试如下所示重构代码:

const RegisterUser = async (email: string, password: string, name: string, history: any) => {
  setIsLoading(true)
  const userCredential = await createUserWithEmailAndPassword(auth, email, password)
  
  const newUser = {
    email,
    displayName: name
  };
  
  setUser(newUser);
  setError('')
  
  // Pass userCredential.user instead of auth.currentUser
  updateProfile(userCredential.user, {
    displayName: name
  }).then(() => {}).catch((error) => {});
    history.replace('/');
  })
}

相关问题