等待在孙组件中解析祖父组件的方法

Question

我的 vue 应用程序中有三个组件：

• 家：（巴顿的祖父母）

• 对话框：（Home 的孩子 / Button 的父母）

• 按钮：（家的孙子）

该Home组件有一个异步方法：

async handleDialogAccept() {

  try {

    const response = await this.$axios.get('https://jsonplaceholder.typicode.com/todos/');

    console.log(response.data);

  } catch (err) {

    console.log(err);

  }

},

它会在Dialog组件发出“accept”自定义事件后立即执行：

<dialog-confirmation

  @accept="handleDialogAccept()"

/>

该Dialog组件有一个子组件 ( Button)：

<button-accept

  v-on="$listeners"

>

  Accept

</button-accept>

在 mybuttonAccept.vue中导入Dialog并使用如上所示具有下一个结构：

<template>

  <v-btn

    color="primary"

    @click="handleClick()"

    :loading="loading"

    :disabled="loading"

  >

    <slot name="accept"></slot>

  </v-btn>

</template>

<script>

export default {

  props: ['parentFunction'],

  data() {

    return {

      loading: false,

    };

  },

  methods: {

    handleClick() {

      this.$emit('accept');

    },

  },

};

</script>

我想在handleClick方法中执行以下步骤：

1. 设置loading为真

2. 发出接受自定义事件

3. 等到handleDialogAccept完成

4. 设置loading为假

有没有等待这样做？