Question

使用axios提取api数据：

fetchData () {
  axios.get(globalConfig.OFFERS_URL)
    .then((resp) => {
      this.offersData = resp.data
      console.log(resp)
    })
    .catch((err) => {
      console.log(err)
    })
}

数据功能：

  data () {
    return {
      offersData: {}
    }
  }

现在，我可以在模板中使用提取的数据，例如：{{ offersData.item[0].id }}

但是我可以在数据函数中设置获取的数据吗？

  data () {
    return {
      offersData: {},
      id: this.offersData.item[0].id
    }
  }

这对我不起作用，是否有可能将axios get的响应存储在数据函数中？

Answer 1

您可能正在寻找计算属性：

data () {
  return {
    offersData: {},
  }
},
computed() {
  id() {
    return this.offersData.item && this.offersData.item[0].id;
  }
}

对于数据功能，它用于定义组件的状态形状（设置要跟踪的属性）并为其提供有效的初始值。但是，在这种情况下，id既不应该是状态的一部分（毕竟始终是offersData值的一部分），也不能在设置offersData之前计算其初始值通过远程呼叫。

如何在数据功能中使用axios响应数据-Vue

1 个答案: