Vue displays "no data" from the opening of the page to the completion of the request data?

<template>
  <div>
    <ul>
      <li v-for="item in datas"></li>
    </ul>
  </div>
  <div v-if="datas.length == 0"></div>
</template>

<script>
export default {
  data () {
    return {
      datas: []
    }
  },
  mounted() {
    let data = utils.getDatas()  //ajax
    if(data.code) {
      this.datas = data.data
    }
  }
}
//"" "" 
Jul.12,2021

you can set a flag isFinish whether to request completion, and render if the request is completed

<template>
  <div>
    <ul>
      <li v-for="item in datas"></li>
    </ul>
  </div>
  <div v-if="datas.length == 0 && isLoadDom"></div>
</template>

<script>
export default {
  data () {
    return {
      datas: [],
      isLoadDom: false // 
    }
  },
  mounted() {
    let data = utils.getDatas()  //ajax
    if(data.code) {
      this.datas = data.data;
      this.isLoadDom = true; // 
    }
  }
}
Menu