react native：如何使用平面列表顯示數據內容？

Question

如何使用平面列表查看數據內容？ 我的目標是顯示 2 個字段的內容，如您所見，他們的數據很多，但我有點不明白該怎么做，很樂意提供幫助。

import React, { useState, useEffect } from 'react';
import { Text, View, StyleSheet, TouchableOpacity,FlatList } from 'react-native';
import { useRoute, useNavigation } from '@react-navigation/native';
import Ionicon from 'react-native-vector-icons/Ionicons';


const DrishotSheNivharoo = () => {
    const navigation = useNavigation();
    const route = useRoute();
    const params = route.params;
    const [paramsFromNekudotDigum, setparams1] = useState(params.paramsFromNekudotDigum);
    console.log('MY PARAMS : ', paramsFromNekudotDigum);

function renderItem({ item, index }) {
    return (
               <View
                style={{
                  flex: 1,
                  flexDirection: 'row',
                  justifyContent: 'space-between',
                }}
              >
            <Text>{Parameters_Bundle_Code}</Text>
            <Text>{Parameters_Bundle_Name}</Text>
        </View>
 );
  }

這是數據：

  {"list": [{"Parameters_Bundle_Code": "jovani", "Parameters_Bundle_Name": "eeeee", "Planned": 1, "Sampling_Due_Date": "2021-01-01", "Sampling_Frequency_Name": null, "Sampling_Instructions": null, "Sampling_Request_ID": 1100587, "Sampling_Type": null, "Water_Source_Code": "Q00405", "Water_Source_Name": "nnnnn"}, {"Parameters_Bundle_Code": "#BMMF", "Parameters_Bundle_Name": "bbbbb MF", "Planned": 1, "Sampling_Due_Date": "2021-01-01", "Sampling_Frequency_Name": null, "Sampling_Instructions": null, "Sampling_Request_ID": 1100126, "Sampling_Type": null, "Water_Source_Code": "NABPPB", "Water_Source_Name": "rrrr"}, {"Parameters_Bundle_Code": "#BMMF", "Parameters_Bundle_Name": "ssss MF", "Planned": 1, "Sampling_Due_Date": "2021-01-01", "Sampling_Frequency_Name": null, "Sampling_Instructions": null, "Sampling_Request_ID": 1100120, "Sampling_Type": null, "Water_Source_Code": "QD0020", "Water_Source_Name": "rotti"}, {"Parameters_Bundle_Code": "#BRCT", "Parameters_Bundle_Name": "golti", "Planned": 1, "Sampling_Due_Date": "2021-01-01", "Sampling_Frequency_Name": null, "Sampling_Instructions": null, "Sampling_Request_ID": 1101085, "Sampling_Type": null, "Water_Source_Code": "RB04UV", "Water_Source_Name": "forti"}}]}

Answer 1

這可能會有所幫助

 const data = {"list": [{"Parameters_Bundle_Code": "#BRCT", "Parameters_Bundle_Name": "jobmart", "Planned": 21}]}

<Text>{data.list[0].Parameters_Bundle_Code}</Text> 

Answer 2

使用Object.keys ：

function renderItem({ item, index }) {
return (
   <View
        style={{
          flex: 1,
          flexDirection: 'row',
          justifyContent: 'space-between',
        }}
      >

        {
            Object.keys(item).map(key => {
                return (
                    <Text>{item[key]}</Text>
                );
            });
        }
    </View>
);}