使用唯一键在数组中读取单个对象中的多个对象。进入平面列表

Question

我正在尝试在 FlatList 中显示此数据。

Array [
  Object {
    "-N1gqvHXUi2LLGdtIumv": Object {
      "Message": "Aeaaeaea",
      "Message_CreatedAt": 1652167522975,
      "Message_by_Email": "vvvv@test.com",
      "Message_by_ID": "DgGfooQIMQQ1rs5xlmmSKCSTrKA2",
    },
    "-N1hB3A_Q7-K75UbvPSM": Object {
      "Message": "Yyoo",
      "Message_CreatedAt": 1652173063182,
      "Message_by_Email": "vvvjugu@test.com",
      "Message_by_ID": "DgGfooQIMQQ1rs5xlmmSKCSTrKA2",
    },
  },
]

我的数据是这样的，它的多个对象在一个数组中的单个对象中，每个对象都有多个唯一的 ID，我该如何读取数据。

我的 FlatList 代码

 <FlatList data={data} renderItem={(Item) => <Text>{Item.item. Message}</Text>}

这里的问题是，FlatList 考虑的是主要对象而不是子对象，我如何访问和渲染 Flatlist 中的子对象以及如何访问唯一 Id。

Answer 1

您可以使用 Object.keys(obj) 访问对象（您的 ID）obj 的键。这 returns 给定对象中包含的所有键的数组，例如：

Object.keys(obj).map(key => console.log(key, obj[key])

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/keys

您还可以仔细查看 Object.entries() 和 Object.values() 函数。

Answer 2

你可以遍历每一个元素，然后。 de-structure 并将密钥与正文结合起来。

  const data = Onsnapshot.forEach((childSnapshot) => {
        const childKey = childSnapshot.key;
        const childData = childSnapshot.val();
        console.log({ childKey, ...childData });}

那么你可以在 FlatList 中获取这些数据

使用唯一键在数组中读取单个对象中的多个对象。进入平面列表

Reading multiple objects, in a single object, with in an array, with unique keys. into FlatList

javascript

json

object

reactjs

react-native