React Native 从 Firebase 获取数据不起作用

埃米尔·博特萨图

我有一个主屏幕，用于从 Firebase 中制作的集合加载提要。firebase 配置适用于网络，它位于另一个文件中，并且工作正常。奇怪的是，当我删除方法调用时，它可以工作，但是当我刷新主屏幕时，它是空白的。此外，firestore 工作正常，帖子和评论上传成功。可能是什么问题呢？

  const HomeScreen = () => {
    
  const [posts, setPosts] = useState(null);
  const [loading, setLoading] = useState(true);

    
  const fetchPosts = async() => {
    try {
      const list = [];
      await firebase.firestore();
      db.collection('posts')
      .get()
      .then((querySnapshot) => {
          querySnapshot.forEach((doc) => {
            const {userId, post, postImg, postTime, likes, comments} = doc.data();
            list.push({
            id: doc.id,
            userId,
            userName: 'Test name',
            userImg: require('../assets/users/user-7.jpg'),
            postTime: postTime,
            post,
            postImg,
            liked: false,
            likes,
            comments,
          })
          })
      })

      setPosts(list);

      if(loading) {
        setLoading(false);
      }

      console.log('Posts', list);
    } catch(e) {
      console.log(e);
    }
  }
  useEffect(() => {
    fetchPosts();
  }, [])
   
    

    return (
        <Container>
            <FlatList
                data={posts}
                renderItem={({item}) => <PostCard item={item} />}
                keyExtractor={(item) => item.id}
                showsVerticalScrollIndicator={false}
            />
        </Container>
    );
}

达马拉吉

setPosts将在您的承诺得到解决之前运行。您的功能是async如此为什么不使用await而不是承诺链接，如图所示：

const fetchPosts = async () => {
  try {
    const list = [];
    const db = firebase.firestore()
  
    const querySnapshot = await db.collection('posts').get()
    querySnapshot.docs.forEach((doc) => {
      const {userId, post, postImg, postTime, likes, comments} = doc.data();
      list.push({
        id: doc.id,
        userId,
        userName: 'Test name',
        userImg: require('../assets/users/user-7.jpg'),
        postTime: postTime,
        post,
        postImg,
        liked: false,
        likes,
        comments,
      })
    })

    setPosts(list);

    if(loading) {
      setLoading(false);
    }
  } catch (e) {
    console.log(e)
  }
}

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。