在flatMap中使用Flat List

时间:2017-09-11 10:53:36

标签: reactjs react-native foreach react-native-flatlist

我正在使用normalizr来基于id规范化api响应。所以最终的归一化响应将是

{
  "names": {
    "12": {
      "Name": "ABC",
      "Status": "0",
      "Count": 11,
    },
    "31": {
      "Name": "CDE",
      "Status": "1",
      "Count": 12,
    }
  }
}

如何在平面列表中使用此名称对象图。它不是数组而是对象图 最好的方法是什么?

PS:我知道有lodash _.values()功能,但我认为它会因为一个巨大的反应而变慢。

1 个答案:

答案 0 :(得分:1)

首先,您可以更改对象以返回包含Object.keys

的数组

这是您的数据

{
  "names": {
    "12": {
      "Name": "ABC",
      "Status": "0",
      "Count": 11,
    },
    "31": {
      "Name": "CDE",
      "Status": "1",
      "Count": 12,
    }
  }
}

你可以用

const dataname = data.names
const datanamearr = Object.keys(dataname).map(key => dataname[key])

这将返回一个数组

然后您可以使用地图功能将数据渲染到FlatList

{datanamearr.map((item) =>
    <FlatList
      data={item}
      renderItem={({item}) => <Text>{item.Name}</Text>}
    />
  )
}