react native：显示来自另一个页面的道具信息

Question

我正在尝试在 flatlist 中打印 EquipmentID 由于某种原因，它没有向我显示它的信息。我想了解我的代码有什么问题。数据（道具）来自另一个屏幕。在我的示例中，我展示了 flatlist 屏幕和它打印的道具。

const EquipmentContentCardOptions = props => {

  const renderItem = ({ item }) => {

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

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

export default EquipmentContentCardOptions;

这是道具:

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

Answer 1

我建议你 console.log(props) 以及 console.log(item) 看看它们是否不是 null.If renderItem 应该是一个组件，然后，你已经在另一个错误的组件中定义了它。另外，名称必须以大写字母开头（如果它是一个组件）。您可能需要包含 FlatList 组件以查看 props 是如何传递给它的。

Answer 2

您正在将道具直接传递给 FlatList，然后尝试访问 EquipSetData 的数据，因此您需要做的是

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

希望这能解决您的问题

react native：显示来自另一个页面的道具信息

react native: display props information that coming from another page

json

reactjs

react-native

react-native-flatlist

react-props