javascript - 异步函数返回未定义

标签 javascript reactjs firebase promise async-await

我真的需要重温我的异步等待和 promise 。我想要一些建议。

我正在对 firebase firestore 进行异步函数调用。该函数应根据单个输入参数返回一个字符串。

该功能用于一对一用户聊天。 功能是创建聊天/查找现有聊天,并返回其 ID。

现在,我得到 undefined 作为 openChat 的返回值,但无法弄清楚原因。除了返回之外,该函数在其他方面都有效。

我有两个功能。一个是 React 类组件生命周期方法,另一个是我的 firebase 异步函数。

类组件生命周期方法如下:

async getChatId(userId) {
  let chatPromise = new Promise((resolve, reject) => {
    resolve(openChat(userId))
  })
  let chatId = await chatPromise
  console.log('chatId', chatId) //UNDEFINED
  return chatId
}

async requestChat(userId) {
  let getAChat = new Promise((resolve, reject) => {
    resolve(this.getChatId(userId))
  })
  let result = await getAChat
  console.log('result', result) //UNDEFINED
}

render() {
  return (<button onClick = {() => this.requestChat(userId)}>get id</button>)
}

这是异步函数:

// both my console.log calls show correctly in console
// indicating that the return value is correct (?)

export async function openChat(otherPersonId) {
  const user = firebase.auth().currentUser
  const userId = user.uid

  firestore
    .collection('users')
    .doc(userId)
    .get()
    .then(doc => {
      let chatsArr = doc.data().chats

      let existsArr =
        chatsArr &&
        chatsArr.filter(chat => {
          return chat.otherPersonId === otherPersonId
        })
      if (existsArr && existsArr.length >= 1) {
        const theId = existsArr[0].chatId

        //update the date, then return id

        return firestore
          .collection('chats')
          .doc(theId)
          .update({
            date: Date.now(),
          })
          .then(() => {
            console.log('existing chat returned', theId)
            //we're done, we just need the chat id
            return theId
          })
      } else {
        //no chat, create one

        //add new chat to chats collection
        return firestore
          .collection('chats')
          .add({
            userIds: {
              [userId]: true,
              [otherPersonId]: true
            },
            date: Date.now(),
          })
          .then(docRef => {
            //add new chat to my user document

            const chatInfoMine = {
              chatId: docRef.id,
              otherPersonId: otherPersonId,
            }
            //add chat info to my user doc
            firestore
              .collection('users')
              .doc(userId)
              .update({
                chats: firebase.firestore.FieldValue.arrayUnion(chatInfoMine),
              })

            //add new chat to other chat user document
            const chatInfoOther = {
              chatId: docRef.id,
              otherPersonId: userId,
            }
            firestore
              .collection('users')
              .doc(otherPersonId)
              .update({
                chats: firebase.firestore.FieldValue.arrayUnion(chatInfoOther),
              })
            console.log('final return new chat id', docRef.id)
            return docRef.id
          })
      }
    })
}

如果您有任何有用的提示,我将永远感激不已!

预期结果是一个返回的字符串。该字符串正确显示在异步函数的 console.log 中)。

实际结果是异步函数的返回值未定义。

最佳答案

您不会从 openChat 函数返回任何内容,因此该函数解析为 undefined

你必须写:

export async function openChat(otherPersonId) {
  const user = firebase.auth().currentUser
  const userId = user.uid

  return firestore // here you need to return the returned promise of the promise chain
    .collection('users')
    .doc(userId)
    .get()
    /* .... */
}

getChatIdrequestChat 中的那些 new Promise 没有多大意义。等待 openChat(userId)this.getChatId(userId)

的结果就足够了
async getChatId(userId) {
  let chatId = await openChat(userId)
  console.log('chatId', chatId) //UNDEFINED
  return chatId
}

async requestChat(userId) {
  let result = await this.getChatId(userId)
  console.log('result', result) //UNDEFINED
}

关于javascript - 异步函数返回未定义,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54654380/

相关文章:

javascript - 如何修复我的代码中的 "cannot read property of addEventListener of null"?

javascript - 调整大小事件处理程序上的响应式 heatmap.js

javascript - ReactJS - ToDo 应用程序,从列表中删除项目

javascript - 卡在按值/子键删除父键

javascript - 防止持久状态锁定 VueX 中的应用程序

javascript - 使用 HTML5 拖放防止拖动事件干扰 Firefox 中的输入元素

javascript - 输入上的 onChange 不会使用 setState 更新状态

ios - 快速读取Firebase实时数据库中的数据

android - 计算 Firebase 云消息传递中某个主题的订阅者

javascript - Backbone Tempting with Underscore 正在渲染模板中的一个属性,但不渲染另一个属性