当我尝试在 React 中使用 put 方法时，出现错误 400：“该字段是必需的”

Question

我看不出代码中有什么问题；我想使用 Put 方法，但是当我这样做时，API 返回的响应是：

"errors": {
    "$": [
        "The JSON value could not be converted to MTE.API.Request.Supplier.PutSupplierRequest. Path: $ | LineNumber: 0 | BytePositionInLine: 2."
    ],
    "request": [
        "The request field is required."
    ]
}

我想要实现的是，通过可视化表格中的一系列数据，我可以从模式中编辑信息。我认为问题就在那里，但我不知道为什么。其他方法效果很好（获取、发布和删除）。

我的请求结构如下：
有关更多上下文：我有一个 const 来定义 url：http://api.com/api/suplier

 actualizarProveedor: async (proveedorData) => {
    try {
      const response = await axios.put(`${API_BASE_URL}`, proveedorData, {
        headers: {
          'Content-Type': 'application/json',
        },
      });
  
      console.log('Actualizar Proveedor:', response.data);
      return response.data;
    } catch (error) {
      console.error('Error en actualizarProveedor:', error);
      throw error;
    }
  },

这就是数据发送到请求的方式：

const handleGuardarEdicion = async (editedProveedor) => {
    try {
      await apiCompras.actualizarProveedor(editedProveedor.id, {
        id: editedProveedor.id,
        name: editedProveedor.nombre,
        ruccode: editedProveedor.numeroRUC,
      });
  
      console.log('Proveedor actualizado exitosamente:', editedProveedor);
  
      cargarProveedores();
    } catch (error) {
      console.error('Error al actualizar proveedor:', error);
    }
  };

最后，这就是模态的构造方式：

<Dialog open={modalOpen} onClose={handleCloseModal}>
  <DialogTitle>Editar Proveedor</DialogTitle>
  <DialogContent>
    <form>
      <TextField
        label="Nombre"
        variant="outlined"
        margin="normal"
        fullWidth
        required
        value={selectedProveedor ? selectedProveedor.name : ''}
        onChange={(e) => handleEditFieldChange('name', e.target.value)}
      />
      <TextField
        label="Código RUC"
        variant="outlined"
        margin="normal"
        fullWidth
        required
        value={selectedProveedor ? selectedProveedor.ruccode : ''}
        onChange={(e) => handleEditFieldChange('ruccode', e.target.value)}
      />
    </form>
  </DialogContent>
  <DialogActions>
    <Button onClick={() => { handleGuardarEdicion(selectedProveedor); handleCloseModal(); }} color="primary">
      Cerrar
    </Button>
  </DialogActions>
</Dialog>

我已进行更改，将错误消息更改为：

"errors": {
    "Id": [
        "The field Id must be between 1 and 2147483647."
    ],
    "Name": [
        "The Name field is required."
    ],
    "RUCCODE": [
        "The RUCCODE field is required."
    ]
}

将此添加到请求中：

try {
  const requestData = {
    request: {
      id: supplierData.id,
      name: supplierData.name,
      ruccode: supplierData.ruccode,
    }
  };

Answer 1

您向

actualizarProveedor()

发送两个参数，但它的签名只接受一个。我假设第二个参数中的对象是您要发送的数据，因此它被忽略。

要解决此问题，您可以修改调用以仅传递对象：

await apiCompras.actualizarProveedor({
  id: editedProveedor.id,
  name: editedProveedor.nombre,
  ruccode: editedProveedor.numeroRUC,
});