【vue】数据加载后渲染页面

vue 想要先加载完所有数据再渲染页面

使用v-if来控制

• 先设置showCard为false，内容card为""
• 请求成功后设置showCard为true，内容card为请求得到的数据res.data

data() {
  return {
    card:"",
    showCard:false,
  }
} 

created() {
  this.$vux.loading.show({ text: "正在加载" });
  this.$api.cardInterface
  .getCard({
    //   cardId:"001"
  })
  .then(res => {
    this.$vux.loading.hide();
    console.log(res);
    if (res.data.success) {
      this.showCard = true;
      this.card = res.data;
    } else {
      this.$vux.toast.show({ type: "cancel", text: "提交失败" });
    }
  })
  .catch(err => {
    this.$vux.loading.hide();
    this.$vux.toast.show({ type: "warn", text: "Request failed" });
    console.error(err);
  });