vue 如何监听到异步组件加载完成

Question

<keep-alive :max="30">

            <template v-if="tab.name===activeName">
                <component v-bind:is="currentTabComponent" v-bind="currentTabComponent.defaults"></component>
            </template>
        </keep-alive>

component 中的异步组件怎么知道何时加载完成，有没有callback之类的函数？

Answer 1

$nextTick ?

Answer 2

在 component 内部的 mounted 钩子派发一个完成事件：

mounted() {
    this.$emit('done')
}

然后在外部监听这个事件

<component @done="handleDone" v-bind:is="currentTabComponent" v-bind="currentTabComponent.defaults"></component>

handleDone() {
    console.log(`加载完成`)
}