使用v-cloak不能处理异步请求

Question

我尝试使用v-cloak指令来显示加载微调器，因为某些vue js数据属性是异步加载的，这样我就可以将其提供给表组件。

当我在整个vue实例<div id="app"></div>元素上应用我的v-cloak样式时，我已经设置了它们，并且可以正常工作。然而，期望的行为是在挂载组件时，如果预期的数据，即从服务器异步加载的联系人数组，我想将v-cloak指令应用于等待联系人填充的MyTable组件，而不是显示一个空表，显示一个加载指示器。

这个是可能的吗？如果是这样，我该怎么做呢？

Answer 1

我认为可能对v-cloak的作用存在误解。

v-cloak

此指令将保留在元素上，直到关联的Vue实例完成编译。

如果你想在加载时隐藏一些东西，你需要自己管理状态和加载器。

通常，这是通过在加载数据后更新的computed来完成的，它使用v-if或v-show为其他组件切换loader组件

这是一个简化的例子..。

<template>
  <MySpinner v-if="loading"/>
  <MyTable v-else :data="myAsynchData"/>
<template>

<script>
//... some code here
  computed: {
    loading => this.myAsynchData == undefined
  }
//... more code
</script>