Vue axios 从 api 获取数据 -

Posted 2023-02-16

【中文标题】Vue axios 从 api 获取数据 -

【英文标题】：Vue axios fetch data from api with -

【发布时间】：2021-09-22 02:35:16

【问题描述】：

我有这个工作代码。

<template>
<v-card-text class="text-center"> ethPrice.ethereum.usd  US$</v-card-text>
</template>

data() 
 return 
  ethPrice:  "ethereum":  "usd": ""  ,
 ;
,
mounted() 
 axios
  .get(
    "https://api.coingecko.com/api/v3/simple/price?ids=ethereum&vs_currencies=usd"      
  )
  .then((response) => (this.ethPrice = response.data));

但是，当我对另一个做同样的事情时，我得到了这个错误。

<template>
<v-card-text > slpPrice.smooth-love-potion.usd </v-card-text>
</template>

 data() 
  return 
  slpPrice:  "smooth-love-potion":  "usd": ""  ,
 ;
,
mounted() 
 axios
  .get(
    "https://api.coingecko.com/api/v3/simple/price?ids=smooth-love-potion&vs_currencies=usd"      
  )
  .then((response) => (this.slpPrice = response.data));

为什么一个工作而另一个不工作？我怎样才能解决这个问题？ 我试图使它成为反应对象，但第一个不起作用。

.then((response) => (this.$set(this.ethPrice, response.data)));

【问题讨论】：

smooth-love-potion 不能通过点符号访问。 slpPrice['smooth-love-potion'].usd

【参考方案1】：

正如您在上面的评论中看到的，您必须像这样访问它。

<template>
  <v-card-text > slpPrice['smooth-love-potion'].usd </v-card-text>
</template>

...