Vue SFC - 等待子事件发出然后函数结束

问题描述

我在父组件中有一个 async 方法，它在子组件内打开了一个 b-modal 组件，我想等到 hide 事件发出并且关联的函数结束才能继续执行功能。

家长：

<template>
    <div>
        <b-button @click="modal_queue()">
            Open modal
        </b-modal>
        <child ref="myChild"></child>
    </div>
</template>

export default {
    methods: {
        async modal_queue() {
            for(let i=0,i<2<i++) {
                await this.aFunction();
            }
        },async aFunction() {
            return new Promise(resolve => {
                this.$refs.mychild.$refs.myModal.$on("hide",() => {
                    resolve();
                }
            })
        }
    }
}

孩子：

<template>
    <b-modal ref="myModal" @hide="hidden()">
    </b-modal>
</template>

export default {
    methods: {
        hidden() {
            // Something
        }
    }
}

所以我想等到 Something 代码结束以解决我的 Promise。

我怎么能做到这一点？我的代码架构不好吗？目前，我只是在等待 'hide' 事件发出。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

bootstrap-vue vue-sfc