如何使用onSnapshot通过Redux更新道具

Question

我正在学习如何编码，但我确实在以下问题上苦苦挣扎：

我正在构建聊天应用程序，我需要在提交新消息后立即显示它们。结果，我想到了使用onSnapshot（）。每当我在基本的一页练习中使用onSnapshot（）时，它就会起作用。但是，现在我有一个包含3个文件夹的项目（src； public； functions）。对于我的所有功能，我使用this.props.functionName（）获取/发送数据，并通过Redux管理状态，然后，后端将返回Promise。

我的问题是，鉴于我无法调用该函数或使用return，如何使用onSnapshot更新我的道具。

我尝试直接在组件中使用admin sdk，但是firebase在控制台中发出了警告，说我只能在后端使用它。

基本上，如何在不调用函数的情况下将以下数组发送到需要将其发送到的组件？

exports.messages = (req, res) => {
    db.collection('messages').onSnapshot(snapshot => {
        let messages = [];
        snapshot.forEach(doc => {
          messages.push(doc.data())
        });
      })
}

提前感谢！

Answer 1

您可以在this tutorial中找到一种更新可能适合您的Firebase道具的方法。他们使用的示例代码是：

useEffect(() => {
  const unsubscribe = props.firebase
    .db.collection('myCollectionName')
    .onSnapshot(snapshot => {
      if (snapshot.size) {
        // we have something
        ** Handle returned data **
      } else {
        // it's empty
      }
    })
return () => {
    unsubscribe()
  }
}, [props.firebase])

还有另一个用于处理返回的数据：

let myDataArray = []
snapshot.forEach(doc =>
  myDataArray.push({ ...doc.data() })
)
setData(myDataArray)