feat: loading skeleton

This commit is contained in:
Anthony Fu 2022-11-27 13:02:19 +08:00
parent 1bd710daa4
commit 77a87af46a
4 changed files with 42 additions and 4 deletions

View file

@ -27,10 +27,12 @@ const { items, state, endAnchor, error } = usePaginator(paginator)
/>
</template>
<div ref="endAnchor" />
<div v-if="state === 'loading'" p5 text-center flex="~ col" items-center animate-pulse>
<div text-secondary i-ri:loader-2-fill animate-spin text-2xl />
<span text-secondary>Loading...</span>
</div>
<slot v-if="state === 'loading'" name="loading">
<div p5 text-center flex="~ col" items-center animate-pulse>
<div text-secondary i-ri:loader-2-fill animate-spin text-2xl />
<span text-secondary>Loading...</span>
</div>
</slot>
<div v-else-if="state === 'done'" p5 text-secondary italic text-center>
End of the list
</div>