如何从函数中连续返回 Firebase docChanges 实时更新结果？

Question

我觉得我缺少一些基本的东西，但我已经阅读了 Firebase 文档，并查看了我能找到的所有相关 SO 帖子。

我有以下功能：

const checkUsername = username => {
  const fb = require('../firebaseConfig.js')

  fb.usernamesCollection.onSnapshot(querySnapshot => {
    let isValid = querySnapshot.docChanges().every(change => {
      return !(
        (change.type === 'added' && change.doc.id === username) ||
        (change.type === 'removed' && change.doc.id !== username)
      )
    })
    console.log('result 1: ', isValid)
    callback(isValid)
  })
}

我将 checkusername 的结果输入到自定义 VeeValidate 规则中，因此它需要是一个布尔值

为此，我试图返回isValid 的值，该值是根据（在这种情况下）我的usernamesCollection 中是否存在用户名设置的，并在添加新文档时进行评估/从集合中删除。

由于 Firebase 中对集合的任何更改都会触发 isValid 重新计算，因此我不能依赖将其全部包装在 Promise 中并返回它，因为它只会在输入更改时执行，因为它是如何工作的与 VeeValidate 结合使用。

完整代码如下：

import { Validator } from 'vee-validate'

const checkUsername = username => {
  const fb = require('../firebaseConfig.js')

  fb.usernamesCollection.onSnapshot(querySnapshot => {
    let isValid = querySnapshot.docChanges().every(change => {
      return !(
        (change.type === 'added' && change.doc.id === username) ||
        (change.type === 'removed' && change.doc.id !== username)
      )
    })
    console.log('result 1: ', isValid)
    callback(isValid)
  })
}

const uniqueUsername = value => {
    const Filter = require('bad-words')
    const filter = new Filter()
    const username = value.toLowerCase().trim()

    let isValid = false

    try {
        if (!filter.isProfane(username)) {
            checkUsername(username, available => {
                console.log('result 2: ', available) //<---Not available outside this scope
            })
        }
        return {
            valid: isValid
        }
    } catch (err) {
        console.log(err)
        return {
            valid: false
        }
    }
}

Validator.extend(
    'unique_username',
    {
        getMessage: field => `${field} is not available.`,
        validate: uniqueUsername
    },
    {
        immediate: false
    }
)

这很可能是 Firebase 调用是异步的问题，但我不确定如何修改我的代码来解决这个问题。感谢您的帮助，谢谢！

Answer 1

好的，如果你让checkUsername 返回一个用isValid 解析的承诺，那么你可以在uniqueUsername 中等待它

const checkUsername = username => {
  return new Promise(resolve => {
    const fb = require('../firebaseConfig.js')

    fb.usernamesCollection.onSnapshot(querySnapshot => {
      let isValid = querySnapshot.docChanges().every(change => {
        return !(
          (change.type === 'added' && change.doc.id === username) ||
          (change.type === 'removed' && change.doc.id !== username)
        )
      })
      console.log('result: ', isValid)
      resolve(isValid);
    });
  });

}

const uniqueUsername = async value => {
  const Filter = require('bad-words')
  const filter = new Filter()

  const username = value.toLowerCase().trim()
  let isValid = false

  try {
    if (!filter.isProfane(username)) {
      const isValid = await checkUsername(username) // <--- this is where I want the value returned to
    }
    return {
      valid: isValid
    }
  } catch (err) {
    console.log(err)
    return {
      valid: false
    }
  }
}