react native: display props information that coming from another page

Issue

I'm trying to print EquipmentID inside the flatlist And for some reason it does not show me its information. I would like to understand what is wrong with my code. The data (props) come from another screen . in my example i show the flatlist screen and the props as it print.

const EquipmentContentCardOptions = props => {

  const renderItem = ({ item }) => {

    return <Text>{props.EquipmentID}</Text>;
   
  };

  return (
    <FlatList
      data={props}
      renderItem={renderItem}
      keyExtractor={item => item.EquipmentID}
    />
  );
};

export default EquipmentContentCardOptions;

this is the props :

{
   "EquipSetData":[
      {
         "EquipmentID":"567",
         "EquipmentName":"aaa",
         
      },
      {
         "EquipmentID":"123",
         "EquipmentName":"rrr",
      }
        ]
}

Solution

you are passing props directly to the FlatList and then trying to access the EquipSetData's data so what you need to do is

 <FlatList
  data={props.EquipSetData}
  renderItem={renderItem}
  keyExtractor={item => item.EquipmentID}
/>

Hope this would resolve your issue

Answered By - Dilnawaz Khan