React Native Firebase 添加和获取数据

Question

想知道是否有人可以在这件事上帮助我。我正在关注https://rnfirebase.io/firestore/usage 的文档。由于某种原因，它不适用于我的用例。

我只需要设置它可以工作的数据，然后将其读回，这样我就可以将它推送到我的状态并渲染它。

我只是无法正确读取数据。当用户单击要添加的按钮时触发此 addItemFunction。

 const addItemFunction = async (numb,exercise) =>{
     firestore().collection(userEmail).get().then((snap) =>{
         if(!snap.empty){

           var finalID = uuid.v4();
            firestore().collection(userEmail).doc(final).update({
              [finalID]:{
                exe:[exercise],
                num:[numb],
              }
            }).then(() =>{
//RETURN SNAPSHOT NOT WORKING
              console.log('user_added');
              firestore().collection(userEmail).doc(final).onSnapshot(documentSnapshot =>{
                console.log("here" + documentSnapshot.data());
              });
}

感谢您的宝贵时间。

Answer 1

如果您使用带有钩子的反应，我建议您将 onSnapshot 侦听器放在 useEffect 钩子中：

useEffect(() => {
  const unsubscribe = firestore
    .collection(collectionName)
    .doc(docId)
    .onSnapshot(
      (documentSnapshot) => {
        const document = documentSnapshot.data();
        console.log(document)
      },
      (error: Error) => {
        throw error;
      }
    );

  return () => unsubscribe();
}, [ docId, collectionName]);

这种方法将分离关注点，并且每次文档发生更改时都会运行快照，然后我将 console.log 放置在您可以将文档设置为状态的位置。

另一种方法是使用 get() 而不是 onSnapshot，例如：

const addItemFunction = async (numb,exercise) =>{
  firestore().collection(userEmail).get().then((snap) =>{
    if(!snap.empty){

      var finalID = uuid.v4();
      firestore().collection(userEmail).doc(final).update({
        [finalID]:{
          exe:[exercise],
          num:[numb],
        }
      }).then(() =>{
        console.log('user_added');
        firestore().collection(userEmail).doc(final).get().then(() => {
           console.log("here" + documentSnapshot.data());
        })


      }
    }
  }

这种方法不会订阅更改，并且每次调用 addItemFunction 时都会返回新的更新文档