vue不同组件之间接口先后调用

需求:

页面加载后获取接口A,然后获取接口B

通过A接口获取info,info为接口B的参数

A和B在vue不同的组件里,这就涉及到接口返回的一个时间差

假如A接口在A组件内,B接口在B组件内。

解决方案:

A组件请求A接口后存放在vuex

state: {

  info:null

}

B组件内通过computed进行实时计算监听

computed: {

  info() {

    return this.$store.state.info;

  }

}

然后,通过watch监听info,监听到有值后,就可以调用接口B

needInfo(fn) {

  let watchAch = this.$watch("info", (val, oldVal) => {

    if (val) {

      this[fn]();

      watchAch(); //取消监听

    }

  });

},