fix VInfiniteScroll

This commit is contained in:
jxxghp
2024-04-19 13:56:57 +08:00
parent 40cdb820fb
commit cfbc5802e4
4 changed files with 18 additions and 11 deletions

View File

@@ -57,7 +57,7 @@ async function loadHistory({ done }: { done: any }) {
isRefreshed.value = true
if (currData.value.length === 0) {
// 如果没有数据,跳出
done('error')
done('empty')
} else {
// 合并数据
historyList.value = [...historyList.value, ...currData.value]
@@ -156,6 +156,9 @@ const dropdownItems = ref([
<template #loading>
<LoadingBanner />
</template>
<template #empty>
没有更多数据
</template>
<template v-for="(item, i) in historyList" :key="i">
<VListItem>
<template #prepend>
@@ -212,9 +215,6 @@ const dropdownItems = ref([
</template>
</VListItem>
</template>
<VCardText v-if="historyList.length == 0 && isRefreshed" class="text-center">
没有数据
</VCardText>
</VInfiniteScroll>
</VList>
</VCard>

View File

@@ -71,13 +71,15 @@ async function fetchData({ done }: { done: any }) {
isRefreshed.value = true
if (currData.value.length === 0) {
// 如果没有数据,跳出
done('error')
done('empty')
return
}
// 合并数据
dataList.value = [...dataList.value, ...currData.value]
// 页码+1
page.value++
// 返回加载成功
done('ok')
}
}
else {
@@ -92,7 +94,7 @@ async function fetchData({ done }: { done: any }) {
isRefreshed.value = true
if (currData.value.length === 0) {
// 如果没有数据,跳出
done('error')
done('empty')
} else {
// 合并数据
dataList.value = [...dataList.value, ...currData.value]
@@ -107,7 +109,6 @@ async function fetchData({ done }: { done: any }) {
}
catch (error) {
console.error(error)
// 返回加载失败
done('error')
}
@@ -127,6 +128,7 @@ async function fetchData({ done }: { done: any }) {
@load="fetchData"
>
<template #loading />
<template #empty />
<div
v-if="dataList.length > 0"
class="grid gap-4 grid-media-card mx-3"

View File

@@ -63,7 +63,7 @@ async function fetchData({ done }: { done: any }) {
isRefreshed.value = true
if (currData.value.length === 0) {
// 如果没有数据,跳出
done('error')
done('empty')
} else {
// 合并数据
dataList.value = [...dataList.value, ...currData.value]
@@ -88,7 +88,7 @@ async function fetchData({ done }: { done: any }) {
isRefreshed.value = true
if (currData.value.length === 0) {
// 如果没有数据,跳出
done('error')
done('empty')
} else {
// 合并数据
dataList.value = [...dataList.value, ...currData.value]
@@ -122,6 +122,7 @@ async function fetchData({ done }: { done: any }) {
@load="fetchData"
>
<template #loading />
<template #empty />
<div
v-if="dataList.length > 0 && props.type === 'tmdb'"
class="grid gap-4 grid-media-card mx-3"

View File

@@ -82,7 +82,7 @@ async function loadMessages({ done }: { done: any }) {
}
else {
// 没有新数据
done('error')
done('empty')
}
// 取消加载中
loading.value = false
@@ -111,15 +111,19 @@ onBeforeUnmount(() => {
<template>
<VInfiniteScroll
mode="intersect"
:mode="!isLoaded ? 'intersect' : 'manual'"
side="start"
:items="messages"
class="overflow-hidden"
@load="loadMessages"
load-more-text="加载更多 ..."
>
<template #loading>
<LoadingBanner />
</template>
<template #empty>
没有更多数据
</template>
<div>
<VRow
v-for="(msg, index) in messages"