在vuejs中顺序调用函数

export default {
  created() {
    this.function1();
    this.function2();
    this.function3();
  },
  methods: {
    function1() {
      // 第一个函数的逻辑
    },
    function2() {
      // 第二个函数的逻辑
    },
    function3() {
      // 第三个函数的逻辑
    },
  },
};

export default {
  async created() {
    await this.function1();
    await this.function2();
    await this.function3();
  },
  methods: {
    function1() {
      return new Promise((resolve, reject) => {
        // 第一个函数的逻辑
        resolve();
      });
    },
    function2() {
      return new Promise((resolve, reject) => {
        // 第二个函数的逻辑
        resolve();
      });
    },
    function3() {
      return new Promise((resolve, reject) => {
        // 第三个函数的逻辑
        resolve();
      });
    },
  },
};

export default {
  data() {
    return {
      data1: '',
      data2: '',
      data3: '',
    };
  },
  watch: {
    data1: {
      immediate: true,
      handler() {
        this.function1();
      },
    },
    data2: {
      immediate: true,
      handler() {
        this.function2();
      },
    },
    data3: {
      immediate: true,
      handler() {
        this.function3();
      },
    },
  },
  methods: {
    function1() {
      // 第一个函数的逻辑
    },
    function2() {
      // 第二个函数的逻辑
    },
    function3() {
      // 第三个函数的逻辑
    },
  },
};