Question

我正在将记录添加到我正在屏幕中呈现的firebase的子集合中。我遇到的问题是，一旦执行firestore.add（），新记录就不会被拉出并呈现在屏幕上。我了解到，firestore / firebase会自动提取新记录并重新渲染显示它们的实际屏幕，但就我而言，这种方式行不通。在完成firestore.add（）之后，我必须调用一些命令来更新实际屏幕吗？

谢谢

Answer 1

您必须订阅集合更新才能在应用程序中实际看到更新。

根据documentation：

您可以使用onSnapshot（）方法收听文档。

可以使用以下代码实现：

state = {
  loading: true,
  users: []
}

componentDidMount() {
  this.unsubscribe = firebase.firestore().collection('users').onSnapshot(this.onCollectionUpdate) 
}

componentWillUnmount() {
  // we have to unsubscribe when component unmounts, because we don't need to check for updates
  this.unsubscribe()
}

onCollectionUpdate = (querySnapshot) => {
  // we have to update the state
  const users = []
  querySnapshot.forEach((document) => {
    const { firstName, lastName } = document.data()

    users.push({
      key: document.id,
      document,
      firstName,
      lastName
    })
  })

  this.setState({ 
    users,
    loading: false
 })
}

可以找到更详细的示例here。

使用Firestore时在React Native中自动刷新子集合

1 个答案: