vue中,有两个ajax请求,第二个需要用到第一个的请求结果,但此时第一个ajax的数据还没保存好,该如何解决?

现有两个组件,组件a需要请求数据并通过vuex保存在store中,当组件b请求数据时需要用到之前保存在store中的数据,但此时组件a请求的的是数据还没有保存好

请问这种情况该如何处理?

阅读 8.4k
7 个回答

中间加一个变量,从vuex里面拿值,然后在watch里面监听一下,监听到好了就在去请求第二个接口呗

如果是两个组件的请求,那可能需要到组件间的通信了,在组件a请求完毕储存数据之后通过$emit通知组件b,组件b再发起请求.
ps: 既然用到vuex了为什么还要去local Storage里面的数据?

请求数据这种操作不应该放在组件内进行,建议写在action中,a的请求和b的请求分两个action,a请求action执行完后再执行b请求action

加多一个全局变量。。如flag=false
a请求成功改为true
为false的b请求不执行。。
然后监听flag变化,如果变为true就执行

一般用promise then
或者async await

楼上正解利用promise的特性附上代码

// 注:api.mineBaseMsgApi()是我封装的基于axios的请求方法
getData({commit}, params) {
    return new Promise((resolve, reject) => {
      api.mineBaseMsgApi('url' + userId)
        .then(res => {
          commit('montations', res.result)
          resolve(res)
        })
        .catch(error => {
          reject(error)
        })
    })
}
推荐问题
宣传栏