使用 VueX Store 中的计算属性进行 Ajax 调用的正确方法是什么答案

【问题标题】：What is the proper way to do Ajax call with computed properties from VueX Store使用 VueX Store 中的计算属性进行 Ajax 调用的正确方法是什么
【发布时间】：2019-08-30 06:34:58
【问题描述】：

如何使用调用参数之一作为 VueX 中的计算状态进行 ajax 调用。例如，如果我创建 this.$axios.get('someUrl/' + accID )，accID 是来自 VueX 的计算属性（通过 MapState）。有时 id 返回“未定义”，我怀疑这是由于 axios 在从商店填充 id 数据之前发出 get 请求

我曾尝试在 Vue 组件中的“accID”上使用 watch() 来等待 accID 解析，但无济于事

//部分代码

 computed: {
    ...mapState(['user']),
  },

 async fetchData() {


        const [foodData, option] = await Promise.all([
          this.$axios({
            url: `food/${this.user.accID}`,
            method: 'get',
          }),
          this.$axios({
            url: 'options',
            method: 'get',
          })
        ])

  //foodData returns undefined because user.accID is undefined (sometimes)

期待

this.$axios({ 网址：'食物/12345'，方法：'得到' })

相反

this.$axios({ 网址：'食物/未定义'，方法：'得到' })

【问题讨论】：

稍微修改了url参数。我很确定我的原始代码中有 this.user.accID。

标签： javascript vue.js vuejs2 axios vuex

【解决方案1】：

在url 中将${user.accID} 更改为${this.user.accID}：

url: `food/${this.user.accID}`,

【讨论】：