arthur/ui
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/ui.git synced 2026-01-26 09:50:33 +01:00
Code Issues Packages Projects Releases Wiki Activity

docs(table): use status instead of deprecated pending in useFetch and useAsyncData (#2084)

Browse Source 
Co-authored-by: Samuel Belo <samuel.belo@devoteam.com>
This commit is contained in:
sam
2024-09-03 09:30:09 +01:00
committed by GitHub
parent f745550f45
commit 0527f8db58
2 changed files with 6 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
docs/components/content/examples/TableExampleAdvanced.vue
View File

@@ -85,7 +85,7 @@ const pageFrom = computed(() => (page.value - 1) * pageCount.value + 1)
const pageTo = computed(() => Math.min(page.value * pageCount.value, pageTotal.value)) const pageTo = computed(() => Math.min(page.value * pageCount.value, pageTotal.value))
// Data // Data
const { data: todos, pending } = await useLazyAsyncData<{ const { data: todos, status } = await useLazyAsyncData<{
id: number id: number
title: string title: string
completed: string completed: string
@@ -181,7 +181,7 @@ const { data: todos, pending } = await useLazyAsyncData<{
v-model:sort="sort" v-model:sort="sort"
:rows="todos" :rows="todos"
:columns="columnsTable" :columns="columnsTable"
:loading="pending" :loading="status === 'pending'"
sort-asc-icon="i-heroicons-arrow-up" sort-asc-icon="i-heroicons-arrow-up"
sort-desc-icon="i-heroicons-arrow-down" sort-desc-icon="i-heroicons-arrow-down"
sort-mode="manual" sort-mode="manual"

8
docs/content/2.components/table.md
View File

@@ -148,11 +148,11 @@ const columns = [{
sortable: true sortable: true
}] }]
const { data, pending } = await useLazyFetch(() => `/api/users?orderBy=${sort.value.column}&order=${sort.value.direction}`) const { data, status } = await useLazyFetch(() => `/api/users?orderBy=${sort.value.column}&order=${sort.value.direction}`)
</script> </script>
<template> <template>
<UTable v-model:sort="sort" :loading="pending" :columns="columns" :rows="data" sort-mode="manual" /> <UTable v-model:sort="sort" :loading="status === 'pending'" :columns="columns" :rows="data" sort-mode="manual" />
</template> </template>
``` ```
@@ -359,11 +359,11 @@ This can be easily used with Nuxt `useAsyncData` composable.
<script setup lang="ts"> <script setup lang="ts">
const columns = [...] const columns = [...]
const { pending, data: people } = await useLazyAsyncData('people', () => $fetch('/api/people')) const { status, data: people } = await useLazyAsyncData('people', () => $fetch('/api/people'))
</script> </script>
<template> <template>
<UTable :rows="people" :columns="columns" :loading="pending" /> <UTable :rows="people" :columns="columns" :loading="status === 'pending'" />
</template> </template>
``` ```