vue实现在一个方法执行完后执行另一个方法的示例

要实现在一个方法执行完后执行另一个方法，我们可以使用Vue的生命周期函数或者watch来实现。

1. 利用Vue的生命周期函数

Vue提供了许多生命周期函数，其中mounted是一个在组件挂载后执行的函数。我们可以在mounted中调用第一个方法，然后在该方法中的异步操作完成后，再执行第二个方法。

示例代码如下：

<template>
  <div>
    <button @click="method1()">Button</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      // data属性
    };
  },
  methods: {
    method1() {
      // 第一个方法
      // 异步操作完成后执行method2()
      axios.get('/api/data')
        .then(() => {
          this.method2();
        });
    },

    method2() {
      // 第二个方法
      console.log('method2');
    }
  },
  mounted() {
    // 组件挂载后执行
  }
};
</script>

在上面的示例中，当点击按钮时，会先执行method1()方法，该方法中发起异步请求，等数据返回后才会执行method2()方法。

1. 利用Vue的watch

我们可以使用Vue的watch来监听某个数据值的变化，当该数据值变化时，执行相应的方法。我们可以在前一个方法中更改数据值，从而触发watch中的方法。

示例代码如下：

<template>
  <div>
    <button @click="method1()">Button</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      searchData: ''
    };
  },
  methods: {
    method1() {
      // 第一个方法
      // 异步操作完成后更改searchData的值，触发watch
      axios.get('/api/data')
        .then(() => {
          this.searchData = 'search completed';
        });
    },

    method2() {
      // 第二个方法
      console.log('method2');
    }
  },
  watch: {
    searchData() {
      // 监听searchData的变化
      this.method2();
    }
  }
};
</script>

在上面的示例中，当点击按钮时，会先执行method1()方法，该方法中发起异步请求，等数据返回后更改searchData值，从而触发watch中的方法执行method2()方法。