如何在来自firebase的react native中使用列表数据？答案

【问题标题】：how to use list data in react native which is come from firebase?如何在来自firebase的react native中使用列表数据？
【发布时间】：2021-06-18 09:15:16
【问题描述】：

这是我来自 firebase 数据库的数据

{
   "-McT4fSeXaMtZG2uitBJ":{
      "channelid":"55c9b29f-290d-4104-b598-5a8b735e5cc1",
      "comments":"cvvb",
      "name":"sirajul",
      "profilepic":"http://ghhgjjech.org/app-property/images/uploads/demo-profile.png"
   },
   "-McT5Tz2_9GnEjbbuyeH":{
      "channelid":"55c9b29f-290d-4104-b598-5a8b735e5cc1",
      "comments":"fthj",
      "name":"sirajul",
      "profilepic":"http://ghhgjjechotech.org/app-property/images/uploads/demo-profile.png"
   }
}

我用它来获取 firebase 数据

itemsRef.on('value', snapshot => {
            let data = snapshot.val();
            setCommentLists(data);
            console.log(data);
        });

现在我想列出所有数据。该怎么做？

【问题讨论】：

你试过snapshot.forEach并从中获取每个对象并推送到新数组吗？

标签： firebase react-native

【解决方案1】：

您可以使用 javascript .map() 函数。有了它，您可以运行 throw 您的 Array CommentLists 并以您想要的方式显示元素。

查看文档：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map

【讨论】：

但是如何省略 -McT4fSeXaMtZG2uitBJ

【解决方案2】：

您可以使用 Flatlist 显示数据列表

  <FlatList
    data={DATA}
    renderItem={renderItem}
    keyExtractor={(item) => item.id}
    extraData={selectedId}
  />

这是参考 https://reactnative.dev/docs/flatlist

【讨论】：