axios：停止根据键对对象进行自动排序

Question

我正在使用 axios 获取 api 响应。

我正在发送按名称排序的 api 响应http://localhost:8000/api/ingredients/ordering=name

从我的服务器发送的实际对象如下。

{
    2:{"id":2,"name":"anil"},
    1:{"id":1,"name":"sant"},
    3:{"id":3,"name":"vino"}
}

或将密钥作为字符串而不是整数传递

{
    "2":{"id":2,"name":"anil"},
    "1":{"id":1,"name":"sant"},
    "3":{"id":3,"name":"vino"}
}

或字母数字键

{
    "a2":{"id":2,"name":"anil"},
    "a1":{"id":1,"name":"sant"},
    "a3":{"id":3,"name":"vino"}
}

axios 正在做的是对对象进行键排序，并且名称不按排序顺序

{
    1:{"id":1,"name":"sant"},
    2:{"id":2,"name":"anil"},
    3:{"id":3,"name":"vino"}
}

或者如果键是字母数字

{
    a1:{"id":1,"name":"sant"},
    a2:{"id":2,"name":"anil"},
    a3:{"id":3,"name":"vino"}
}

如何阻止这个

我不想要数组格式的列表，因为我必须稍后根据 id 更新各个对象。这种表示很容易。我正在使用reactjs状态。

Answer 1

这是 JavaScript 中对象的预期行为。

如果您想保持订单完整，请使用Arrays，所以您的示例将如下所示，

const obj = [{name:"two"},{name:"three"},{name:"one"}];

如果您需要传递密钥，请按以下方式重新排序，

已编辑

回到您编辑的版本，假设您想根据 ID 更新您的对象，这是您提供的 json，

{
    a1:{"id":1,"name":"sant"},
    a2:{"id":2,"name":"anil"},
    a3:{"id":3,"name":"vino"}
}

没有什么可以阻止您这样做，如果您想更改带有 的对象的详细信息id:2，您可以执行以下操作来获取密钥a2，

const key = Object.entries(obj).find(entry => entry[1].key === 2)[0];
const desiredElement = obj(key);

代码分解，

Object.entries(obj) // get entries from object
.find(entry) //where entry[0] is key, entry[1] is value/object
entry[1].id=== 2 // return the element that has id === 2
[0] // since entry[0] is key, then it would hold a2 here

现在我们可以根据需要使用密钥，例如，Obj[key]并更新它。