Question

我正在尝试使用从helpers.js导出到signUp用户的辅助函数，并将其添加到React应用程序的Firebase集合中。使用有效数据，一切都可以正常工作，但是当我尝试在没有（或无效）数据的情况下进行注册时，会显示该错误，但控制台中仍然会出现“未捕获”的情况。

图片：https://i.imgur.com/4ux1pOz.jpg

助手功能

const signUp = async(email, password) => {

    await firebase.auth().createUserWithEmailAndPassword(email, password)
    .then(res => {
        const db = firebase.firestore();
        db.collection('users').doc(res.user.uid).set({
            email: res.user.email,
            emailVerified: res.user.emailVerified,
            displayName: res.user.displayName,
            phoneNumber: res.user.phoneNumber,
            photoUrl: res.user.photoURL,
            firstName: '',
            lastName: ''
        });
    })
};

反应组件功能

const handleSubmit = (e) => {

            e.preventDefault();
            setLoader(true);
            const {email, password} = e.target.elements;

            signUp(email.value, password.value).then(() => {
                    setLoader(false);
                    history.push('/dashboard');
                }).catch(err => {
                    console.log(err);
                   setError(err.message);
                   setLoader(false);
                });
    };

Answer 1

我认为您应该返回承诺

const signUp =(email, password) => {

    return firebase.auth().createUserWithEmailAndPassword(email, password)
    .then(res => {
        const db = firebase.firestore();
        db.collection('users').doc(res.user.uid).set({
            email: res.user.email,
            emailVerified: res.user.emailVerified,
            displayName: res.user.displayName,
            phoneNumber: res.user.phoneNumber,
            photoUrl: res.user.photoURL,
            firstName: '',
            lastName: ''
        });
    })
};

Answer 2

转换此

await firebase.auth().createUserWithEmailAndPassword(email, password)
    .then(res => {
        const db = firebase.firestore();
        return db.collection('users').doc(res.user.uid).set({
            email: res.user.email,
            emailVerified: res.user.emailVerified,
            displayName: res.user.displayName,
            phoneNumber: res.user.phoneNumber,
            photoUrl: res.user.photoURL,
            firstName: '',
            lastName: ''
        });
    })

到

try {
   let res = await firebase.auth().createUserWithEmailAndPassword(email, password);
   const db = firebase.firestore();
   let created = db.collection('users').doc(res.user.uid).set({
      email: res.user.email,
      emailVerified: res.user.emailVerified,
      displayName: res.user.displayName,
      phoneNumber: res.user.phoneNumber,
      photoUrl: res.user.photoURL,
      firstName: '',
      lastName: ''
    });

    if (created)
        return true;
    else 
        return false;
}
catch (error) {
    console.log(error);
    return Promise.reject(error);
}

现在您可以找到正确的错误并进行更正。

Answer 3

我认为您在async函数中丢失了catch语句，并返回了firebase函数的结果，因此，很容易处理您的firebase操作中的错误，以防万一：

const signUp = async(email, password) => {
    try {

    let result = await firebase.auth().createUserWithEmailAndPassword(email, password)
    .then(res => {
        const db = firebase.firestore();
        db.collection('users').doc(res.user.uid).set({
            email: res.user.email,
            emailVerified: res.user.emailVerified,
            displayName: res.user.displayName,
            phoneNumber: res.user.phoneNumber,
            photoUrl: res.user.photoURL,
            firstName: '',
            lastName: ''
        })
        .catch(error){
         return error
       }
    })

   return result

   }
   catch ( error ){
    // Handle your error here
    return error
   }
};

显示承诺错误消息，但未捕获错误

3 个答案: