React native 遇到两个子项具有相同的键，`[object]`。键应该是唯一的，以便组件在更新期间保持其标识

由于我是React native的新手，有人能理解我在这里遇到的问题吗。如果是，请给出解决方案

从“React”导入React； 从“react native”导入{StyleSheet，TouchableOpacity，ScrollView}； 从“本机基”导入{ListItem，Badge，Text}

常量类别过滤器=（道具）=>{

返回(
{
props.categoryFilter（'all'），props.setActive（-1）
}}
>
全部的
{props.categories.map（（项目）=>(
{
道具类别过滤器（项目编号$oid），
道具设置活动（道具类别索引（项目））
}}
>
{item.name}
))}
)

}

const styles=StyleSheet.create({ 中心：{ 为内容辩护：“中心”， 对齐项目：“中心” }, 活动：{ 背景颜色：“#03bafc” }, 非活动：{ 背景颜色：“#a0e1eb” } })

导出默认类别过滤器

---

我猜我遇到的问题是不透明度，但两个组件中的关键点都不同，但它仍发出警告

您必须将关键点设置为地图中的特定值，而不是包含两个对象的数组。item.\u id似乎是一个包含2个对象的数组。因此，请改为使用item.name吗？

波林是对的。若要添加或删除第一个键，无需执行此操作，并确保item.\u id是唯一的字符串，而不是数组或其他数据类型。修订后的代码如下所示

const CategoryFilter = (props) => {
  return (
    <ScrollView
      bounces={true}
      horizontal={true}
      style={{ backgroundColor: "#f2f2f2" }}
    >
      <ListItem style={{ margin: 0, padding: 0, borderRadius: 0 }}>
        <TouchableOpacity
          onPress={() => {
            props.categoryFilter("all");
            props.setActive(-1);
          }}
        >
          <Badge
            style={[
              styles.center,
              { margin: 5 },
              props.active === -1 ? styles.active : styles.inactive,
            ]}
          >
            <Text style={{ color: "white" }}>All</Text>
          </Badge>
        </TouchableOpacity>
        {props.categories.map((item) => (
          <TouchableOpacity
            key={String(item._id)}
            onPress={() => {
              props.categoryFilter(item._id.$oid);
              props.setActive(props.categories.indexOf(item));
            }}
          >
            <Badge
              style={[
                styles.center,
                { margin: 5 },
                props.active == props.categories.indexOf(item)
                  ? styles.active
                  : styles.inactive,
              ]}
            >
              <Text style={{ color: "white" }}>{item.name}</Text>
            </Badge>
          </TouchableOpacity>
        ))}
      </ListItem>
    </ScrollView>
  );
};

const CategoryFilter=（道具）=>{
返回(
{
道具分类过滤器（“全部”）；
道具设置激活（-1）；
}}
>
全部的
{props.categories.map（（项目）=>(
{
道具类别过滤器（项目编号$oid）；
props.setActive（props.categories.indexOf（item））；
}}
>
{item.name}
))}
);
};

是的，我试过了，但不幸的是，同样的警告删除了第一把你不需要的钥匙。我感谢你们两位的帮助。。。但问题仍然存在：（稍微编辑了代码，请现在使用新代码@Abubakarkhalid进行尝试，如果仍然不起作用，请共享

props.categories

的完整数据。此categories prop是从可能有问题来源的父级传递的。

const CategoryFilter = (props) => {
  return (
    <ScrollView
      bounces={true}
      horizontal={true}
      style={{ backgroundColor: "#f2f2f2" }}
    >
      <ListItem style={{ margin: 0, padding: 0, borderRadius: 0 }}>
        <TouchableOpacity
          onPress={() => {
            props.categoryFilter("all");
            props.setActive(-1);
          }}
        >
          <Badge
            style={[
              styles.center,
              { margin: 5 },
              props.active === -1 ? styles.active : styles.inactive,
            ]}
          >
            <Text style={{ color: "white" }}>All</Text>
          </Badge>
        </TouchableOpacity>
        {props.categories.map((item) => (
          <TouchableOpacity
            key={String(item._id)}
            onPress={() => {
              props.categoryFilter(item._id.$oid);
              props.setActive(props.categories.indexOf(item));
            }}
          >
            <Badge
              style={[
                styles.center,
                { margin: 5 },
                props.active == props.categories.indexOf(item)
                  ? styles.active
                  : styles.inactive,
              ]}
            >
              <Text style={{ color: "white" }}>{item.name}</Text>
            </Badge>
          </TouchableOpacity>
        ))}
      </ListItem>
    </ScrollView>
  );
};