vue.js - 如何在调用完成之前停止渲染我的 vue 组件

Question

我用谷歌搜索了这个，但我找不到任何具体的解决方案。基本上我有一个依赖于 init 调用的 vue 组件，我希望它停止渲染直到调用完成，此时我希望组件渲染。看起来很简单，但除非我遗漏了一些东西，否则我找不到任何生命周期方法来做到这一点。

Answer 1

您可以为此目的使用v-if

<template>
    <div v-if="loaded"></div>
</template>

<script>
    export default {
        name: 'TestComponent',
        data: function () {
            return {
                loaded: false
            }
        },
        created() {
          callExternalServices().then(() => {
             this.loaded = true
          })
        }
    }
</script>

它将呈现一个空组件，直到 loaded == true