無法在 then 方法中調用 function

Question

我試圖在另一個中調用兩個函數

公共服務組件

function AddEmail(user) {
    return auth.createUserWithEmailAndPassword(user.email,user.password);    
    //createUsers(user) this way of calling is working, but i don't want to invoke like this...
}

function createUsers(user) {
    return db.collection("users").add({
        firstName: user.firstName,
        lastName:  user.lastName,
        address:  user.address,
        phoneNumber:  user.phoneNumber,
        email:  user.email,
        role:  user.role,
    });
}

注冊組件

submits(e) { 
    e.preventDefault();
    const { user} = this.state;
        
    commonService.AddEmail(user)
    .then(() => {
        commonService.createUsers(user)
        .then(() =>{//success})
        .catch(err=> console.log(err));
    })
    .catch(err=> console.log(err));
}

AddEmail被執行，但不是createUsers 。 我也嘗試過通過then方法返回和鏈接，仍然無法正常工作，我錯過了什么？

Answer 1

使用async / await嘗試以下操作。

async submit(e){
    e.preventDefault();
    const { user} = this.state;

    try {
        const userEmailAdded = await commonService.AddEmail(user);
        const userCreated = await commonService.createUsers(user);
    } catch (err) {
        console.log(err);
    }
}

確保在 function 調用中都返回 promise。 如果返回值不是 promise，則使用以下代碼將其包裝在 promise 中

function AddEmail(user) {
    return new Promise((resolve, reject){
        const createdUser = auth.createUserWithEmailAndPassword(user.email,user.password);
        if(createdUser)
            return resolve(createdUser);
        else
            return reject("Error in creating user.");
    })
}

檢查控制台中的任何錯誤。 如果沒有，兩個調用都通過了。

Answer 2

嘗試使用此代碼。

submits(e) { 
    e.preventDefault();
    const { user} = this.state;
        
    commonService.AddEmail(user)
    .then(() => commonService.createUsers(user))
    .then(() =>{//success})
    .catch(err=> console.log(err));
}

Answer 3

return auth.createUserWithEmailAndPassword(user.email,user.password);

返回的 function 必須是 javascript Promise才能使用.then 。

您可以嘗試console.log(auth.createUserWithEmailAndPassword)是否是 Promise。