Reactjs使用相同的ID保存和更新相同的用户信息

这是我的

我创建了一个用于保存和编辑信息的按钮

我想，一旦信息是第一次保存，应用程序将注册用户ID，以更新信息，而不是在数据库中创建新行

在沙箱中，您可以找到我编写的代码，但它不起作用。在沙箱中，它不起作用，因为显然没有后端，但这不是我所指的错误。我认为问题出在“服务”文件夹和这段代码中：

if (info.id === null) {
      InfoDataService.create(data)
        .then((response) => {
          console.log('create', response.data);
          setInfo({
            id: response.data.id,
            email: response.data.email,
            firstname: response.data.firstname,
            lastname: response.data.lastname
          });
        })
        .catch((e) => {
          console.error(e);
        });
    } else {
      InfoDataService.update(info.id, data)
        .then((response) => {
          console.log(response);
          setInfo({
            id: response.data.id,
            email: response.data.email,
            firstname: response.data.firstname,
            lastname: response.data.lastname
          });
          console.log(response.data);
        })
        .catch((e) => {
          console.error(e);
        });
    }
  };

---

像这样的方法应该会奏效：

我已经在infoService.js中模拟了您的API，这样它至少可以做些什么，但您应该能够删除这些行，它将在本地为您工作

---

希望这能为你指明正确的方向

它就像我想要的那样工作。唯一的问题是，我的应用程序不会每次更新并创建一个新ID。在您的代码沙盒中，您设置了id:123，我已经删除了该部分代码。我希望每个用户的ID都是唯一的，然后在此基础上执行更新。@FrancescoEsposto应该发生的事情是您的InfoService.create应该返回一个ID，该ID将被设置为info。也许您的后端代码没有正确返回id？用户信息后的括号中显示了什么？首先应该（未保存），然后更改为一个id—如果没有这样做，您的post/api/users端点可能不会按预期返回id。在InfoService.create中，可能是console.log返回的数据，您可能会看到id丢失，或者可能名称不同，或者在我第一次单击“保存”时出现错误的情况（即id不是id），对象创建成功。我点击“编辑”，修改信息，点击“保存”，它被正确更新。第三次他告诉我错误：“请求失败，状态代码为500”XHR PUT localhost:8080/api/users/undefined。答复。JSON:Error updating User with id=undefined“当我第三次更新时，我已经有了这个错误：但我认为这与此无关。所以第二次和第三次之间出现了一些问题。看看发生了什么，你的第二次保存将调用

InfoDataService.update

（UserInfo.js:71）它将调用

update

端点（user.controller.js:50）。问题是您的

InfoDataService.update

调用需要一个响应，它会尝试在第74行使用setInfo更新该响应。但是您的更新端点是一个PUT请求，因此不会（也不应该）响应实际上，返回任何东西。我想如果你在第73行的console.log上搜索，你会发现它是空的。所以解决方法是删除第74行的setInfo。