Vue.js - 如何通过 axios 响应数据从对象中获取特定字段

Posted 2023-02-16

【中文标题】Vue.js - 如何通过 axios 响应数据从对象中获取特定字段

【英文标题】：Vue.js - how to get specified fields from object via axios reponse data

【发布时间】：2020-12-23 22:55:02

【问题描述】：

这是我的 JSON 对象

    "id": 2,
    "dani": 5,
    "asset": 
        "id": 2,
        "code": "1",
        "name": "asset1",
        "descr": null,
        "version": "2020-09-01T15:39:53.821+0000",
        "model": 
            "id": 3,
            "code": "4",
            "name": "ZXc43V",
            "descr": "",
            "version": "2020-09-01T15:22:36.953+0000",
            "year": "2020-03-26"
        ,
        "location": 
            "id": 1,
            "code": "4",
            "name": "Lokacija 5",
            "descr": "",
            "version": "2020-06-03T12:22:55.693+0000",
            "adress": "Obilicev venac 24",
            "dateFrom": "2020-06-03",
            "dateTo": "2022-05-07",
            "active": false
        
    

假设我已经声明了数组“assets[]”。 我想用它做的是当我使用时

axios.get('url').then(response => this.array = response.data 

我想从我的对象（r​​esponse.data 提供）中提取资产名称（asset.name），并仅将资产名称放入我的数组“assets[]”中，因此它仅包含来自 JSON 对象的资产名称，没有别的。

谢谢

【参考方案1】：

你可以使用map函数如下：

this.assets=response.data.map(item=>(name:item.asset.name));

或者如果您不需要该字段：

this.assets=response.data.map(item=>item.asset.name);

【讨论】：

感谢您的回复。在发布此问题之前，我尝试了您的第二个选项（并且我再次尝试了该选项以及您的第一个选项），但我收到此错误：“Uncaught (in promise) TypeError: item.asset is undefined”。跨度>

response.data 的输出是什么？

好的，nvm，我一直在 axios 请求中输入了错误的 url（为此浪费了 2 个小时）......它现在可以工作了（duh）。我会留下这个问题，以防将来有人需要它。再次感谢，你真的很有帮助。

【参考方案2】：

您可以迭代对象并推入数组。

axios.get('url').then((response) => 
  response.data.forEach((item) => 
     this.assets.push(item.asset.name)
  )
)

【讨论】：

虽然此代码可以解决问题，including an explanation 说明如何以及为什么解决问题将真正有助于提高您的帖子质量，并可能导致更多的赞成票。请记住，您正在为将来的读者回答问题，而不仅仅是现在提出问题的人。请edit您的答案添加解释并说明适用的限制和假设。