react-native - 我只想使用以下 JSON 数组在本机反应中呈现一个列表

Question

[{"a": 1000}, {"b": 2000}, {"c": 3000}, {"d": 4000}, {"e": 6000}, {"f": 7000}]

使用这些数据，我想在 react-native 应用程序中创建一个列表，例如

a   1000
b   2000
c   3000
d   4000
e   5000
f   6000

提前致谢

标签： react-nativelistviewreact-native-flatlist

Answer 1

试试这个方法

import React from 'react';
import { SafeAreaView, View, FlatList, StyleSheet, Text, StatusBar } from 'react-native';

const DATA = [{"a": 1000}, {"b": 2000}, {"c": 3000}, {"d": 4000}, {"e": 6000}, {"f": 7000}];
 

const App = () => {

  const renderItem = ({ item }) => {
    const key = Object.keys(item);
    const value = Object.values(item);
    return (
    <View style={{flexDirection:"row"}}>
        <Text>{key[0]}</Text>
        <Text>{value[0]}</Text>
    </View>
    );
  }

  return (
      <FlatList
        data={DATA}
        renderItem={renderItem}
        keyExtractor={(item, index) => index.toString()}
      />
  );
}