Javascript 显示最后一个空对象的“添加新”按钮

我试图为最后一个空对象显示“添加新”按钮。 我使用的代码是“

从“React”导入React；
常量MyComponent（）=>{
常数数据=[{
0: {
id:1，
名称：“数据1”
},
1: {
id:2，
名称：“数据2”
},
2: {
id:3，
名称：“数据3”
},
3: {
id:4，
名称：“数据4”
},
4: {}
}];
返回(
{data.length-1(
新增
) : (
编辑
)}
);
}

---

我检查了是否是最后一个对象，并显示“添加新”或“显示编辑”，但每次都显示“编辑”按钮。

我认为您只是从

控制台复制了
数据。记录
并将其粘贴到您的代码中，这是错误的，您需要进行以下更改：

const MyComponent = () => {
  const data = [
    {
      id: 1,
      name: "Data 1",
    },
    {
      id: 2,
      name: "Data 2",
    },
    {
      id: 3,
      name: "Data 3",
    },
    {
      id: 4,
      name: "Data 4",
    },
    {},
  ];

  return (
    <>
      {data?.map((item, index) => {
        if ((index !== data?.length) && item.id) {
          return <Button>Edit</Button>;
        } else if(!item.id){
          return <Button>Add New</Button>;
        }
      })}
    </>
  );
};

constmycomponent=（）=>{
常数数据=[
{
id:1，
名称：“数据1”，
},
{
id:2，
名称：“数据2”，
},
{
id:3，
名称：“数据3”，
},
{
id:4，
名称：“数据4”，
},
{},
];
返回(
{data？.map（（项目，索引）=>{
if（（索引！==数据？.length）和&item.id）{
返回编辑；
}如果（！item.id），则为else{
返回并添加新的；
}
})}
);
};
您可以使用
数据
上的
映射
来确定对象是否有效（然后显示
添加新的
或
编辑
按钮），如下所示：


const数据=[{
0: {
id:1，
名称：“数据1”
},
1: {
id:2，
名称：“数据2”
},
2: {
id:3，
名称：“数据3”
},
3: {
id:4，
名称：“数据4”
},
4: {}
}];
让datalength=Object.values（数据[0]）.length；
if（Object.values（数据[0]）[datalength-1].id）{
//有效对象
}
否则{
//无效对象
}
hi Giovanni.是的，我想按ID检查，但这些数据可以来自上下文，最后一个对象可以用数据填充，它可以有ID，因此我只需要检查最后一个对象。Ciao@alar，如果你只需要检查最后一个对象，你可以使用
object.values（数据[0]）[datalength-1].id
其中
datalength
是数组长度。对吗？
const MyComponent = () => {
  const data = [
    {
      id: 1,
      name: "Data 1",
    },
    {
      id: 2,
      name: "Data 2",
    },
    {
      id: 3,
      name: "Data 3",
    },
    {
      id: 4,
      name: "Data 4",
    },
    {},
  ];

  return (
    <>
      {data?.map((item, index) => {
        if ((index !== data?.length) && item.id) {
          return <Button>Edit</Button>;
        } else if(!item.id){
          return <Button>Add New</Button>;
        }
      })}
    </>
  );
};