Vue Axios API对象到对象数组

Question

我目前在我的网站上显示货币数据时遇到问题，我想显示货币的短名称和货币的价值。

我正在使用这个api，以美元为基础：https://api.exchangeratesapi.io/latest?base=USD

我运行的代码给我的数据是：

getCurrencies() {
  axios
    .get("https://api.exchangeratesapi.io/latest?base=USD")
    .then(response => {
      this.currencies = response.data.rates;
      console.log(this.currencies);
    });
}

我得到的输出只是货币的价值当然，我正在寻找一种方法将这些对象分解为对象数组，我可以调用ex：currency.short＆currency.price

这样我就可以在网站上单独显示短名称和价格，而不是在我使用“response.data.rates”时显示货币值。

Answer 1

您可以使用Object.keys方法迭代速率和map函数来创建对象，如下所示：

this.currencies = Object.keys(response.data.rates).map(k => ({
    short: k,
    price: response.data.rates[k]
}))