Javascript 可重用组件React Native的设置状态问题

我试着制作一张可重复使用的卡片，这样我可以增加不同物品的数量。 我尝试了很多方法，但都没有成功。 我用平面列表显示每张卡片。 这是卡片：

export default function Card(props) {
  return (
    <View style={styles.card}>
      <Text>{props.children}</Text>
      <TouchableOpacity
        onPress={() => {
          console.log(props.number);
          props.set(props.number+1)
        }}
      >
        <FontAwesome size={30} name="plus" color="red" />
      </TouchableOpacity>
    </View>
  );
}

导出默认功能卡（道具）{
返回(
{props.children}
{
控制台日志（道具编号）；
道具套装（道具编号+1）
}}
>
);
}

这就是我使用平面列表的地方：

export default function User() {
  const [objects, setObjects] = useState([
    {
      id: "1",
      name: "pants",
      quantity: 0,
    },
    {
      id: "2",
      name: "t-shirt",
      quantity: 0,
    },
  ]);
  return (
    <SafeAreaView>
      <FlatList

        data={objects}
        keyExtractor={(item) => item.id}
        renderItem={({ item }) => (
          <Card number={item.quantity} set = {setObjects}>
            {item.name}
          </Card>
        )}
      />
    </SafeAreaView>
  );
}

导出默认函数用户（）{
const[objects，setObjects]=useState([
{
id:“1”，
名称：“裤子”，
数量：0，
},
{
id:“2”，
名称：“t恤”，
数量：0，
},
]);
返回(
项目id}
renderItem={（{item}）=>(
{item.name}
)}
/>
);
}

这行吗？调用

props。如下设置
：

props.set({
  ...props.item,
  quanitity: props.item.quantity + 1,
})

和
卡
：

<Card
  item={item}
  set={item => setObjects(objs => {
    for (const obj of objs) {
      if (obj.id === item.id) {
        obj.quantity++
        break
      }
    }
    return objs
  }}
>

setObjects（objs=>{
用于（对象的常量对象）{
if（obj.id==item.id）{
对象数量++
打破
}
}
返回对象
}}
>

如果这行得通，我仍然建议进行一些重构：

<Card
  item={item}
  add={() => setObjects(objs => {
    for (const obj of objs) {
      if (obj.id === item.id) {
        obj.quantity++
        break
      }
    }
    return objs
  }}
>

setObjects（objs=>{
用于（对象的常量对象）{
if（obj.id==item.id）{
对象数量++
打破
}
}
返回对象
}}
>

及



<TouchableOpacity onPress={props.add}>