@DocTypeMaster

Как сделать Skeleton загрузку на vue?

Здравствуйте, подсмотрел код реализации скелетон загрузки, но тут в примере данные выводятся статично и не понятно как применить его для вывода из базы и соответственно сделать цикл для вывода

<template>
  <div class='profile-card'>
    <div class='profile-image'>
      <img class='profile-image__border' src='/img-border.png' />
      <img class='profile-image__img' :src='userData.pic' />
    </div>
    <div class='profile-info'>
      <span> Written By </span>
      <h3> {{ userData.name }} </h3>
      <p> {{ userData.bio }} </p>
    </div>
  </div>
</template>
<script>
import { ref } from 'vue'

const loadUserData = async () => {
  return new Promise(resolve => {
    setTimeout(() => {
      resolve({
        name: 'Matt Maribojoc',
        pic: 'https://learnvue.co/wp-content/uploads/2020/04/img-border.png',
        bio: 'I run a VueJS community over at https://learnvue.co, develop web sites, and post whatever I find cool on the Internet.'
      })
    }, 4000)
  })
}

export default {
  async setup () {
    const userData = ref(await loadUserData())

    return {
      userData
    }
  }
}

</script>


Если кто-то знает, подскажите !
  • Вопрос задан
  • 44 просмотра
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы