vue接口调用顺序执行

Vue 接口调用顺序执行的方式有多种，以下是其中的一些示例：

1. 使用 async/await

可以在 Vue 的 methods 中使用 async/await，确保按顺序执行异步方法。例如：

methods: {
  async fetchData1() {
    // 异步获取数据的方法1
  },
  async fetchData2() {
    // 异步获取数据的方法2
  },
  async fetchData() {
    await this.fetchData1();
    await this.fetchData2();
    // 执行完 fetchData1 后再执行 fetchData2
  }
}

2. 使用 Promise

可以将异步方法封装成 Promise，再使用 Promise 的链式调用，确保按顺序执行。例如：

methods: {
  fetchData1() {
    return new Promise(resolve => {
      // 异步获取数据的方法1
      resolve();
    });
  },
  fetchData2() {
    return new Promise(resolve => {
      // 异步获取数据的方法2
      resolve();
    });
  },
  fetchData() {
    this.fetchData1().then(() => {
      return this.fetchData2();
    }).then(() => {
      // 执行完 fetchData1 后再执行 fetchData2
    });
  }
}

3. 使用 async/await 和 Promise 的结合

使用 async/await 和 Promise 的结合，可以更方便地写出顺序执行的代码。例如：

methods: {
  fetchData1() {
    return new Promise(resolve => {
      // 异步获取数据的方法1
      resolve();
    });
  },
  fetchData2() {
    return new Promise(resolve => {
      // 异步获取数据的方法2
      resolve();
    });
  },
  async fetchData() {
    await this.fetchData1();
    await this.fetchData2();
    // 执行完 fetchData1 后再执行 fetchData2
  }
}

以上是几种常用的 Vue 接口调用顺序执行的方式，可以根据具体的需求选择适合自己的方法。