diff --git a/src/pages/index/components/PageSkeleton.vue b/src/pages/index/components/PageSkeleton.vue new file mode 100644 index 0000000..5c5e502 --- /dev/null +++ b/src/pages/index/components/PageSkeleton.vue @@ -0,0 +1,362 @@ + + + diff --git a/src/pages/index/index.vue b/src/pages/index/index.vue index 6703da9..c0fe018 100644 --- a/src/pages/index/index.vue +++ b/src/pages/index/index.vue @@ -12,14 +12,17 @@ @scrolltolower="onScrollToLower" @refresherrefresh="onRefresh" > - - - - - - - - + + @@ -33,6 +36,10 @@ import { onLoad } from '@dcloudio/uni-app' import CategoryPanel from './components/CategoryPanel.vue' import HotPanel from './components/HotPanel.vue' import type { JbcGuessInstance } from '@/types/components' +import PageSkeleton from './components/PageSkeleton.vue' + +// 数据加载状态 +const isLoading = ref(true) // 获取轮播图数据 const bannerList = ref([]) @@ -79,10 +86,10 @@ const onRefresh = async () => { } // 页面加载勾子 -onLoad(() => { - getBannerList() - getCategoryList() - getHotList() +onLoad(async () => { + isLoading.value = true + await Promise.allSettled([getBannerList(), getCategoryList(), getHotList()]) + isLoading.value = false })