useLazyFetch
Эта обертка вокруг useFetch запускает навигацию немедленно.
Описание
По умолчанию useFetch блокирует навигацию до разрешения своего асинхронного обработчика. useLazyFetch предоставляет обертку вокруг useFetch, которая запускает навигацию до разрешения обработчика, установив опцию lazy в true.
useLazyFetch имеет ту же сигнатуру, что и useFetch.Пример
pages/index.vue
<script setup lang="ts">
/* Навигация будет происходить до завершения получения данных.
Обрабатывайте состояния 'pending' и 'error' непосредственно в шаблоне вашего компонента
*/
const { pending, data: posts } = await useLazyFetch('/api/posts')
watch(posts, (newPosts) => {
// Поскольку posts может быть изначально равным null, у вас не будет доступа
// к его содержимому сразу, но вы сможете наблюдать за ним.
})
</script>
<template>
<div v-if="status === 'pending'">
Loading ...
</div>
<div v-else>
<div v-for="post in posts">
<!-- Сделай что-нибудь -->
</div>
</div>
</template>
useLazyFetch - это зарезервированное имя функции, которое трансформируется компилятором, поэтому вы не должны называть свою собственную функцию useLazyFetch.