Отримання даних у Nuxt
useFetch, useAsyncData, $fetch, lazy fetching, error handling, refresh, data caching
1Яка основна різниця між useFetch і useAsyncData у Nuxt?
Яка основна різниця між useFetch і useAsyncData у Nuxt?
Відповідь
useFetch — це обгортка навколо useAsyncData і $fetch, яка спрощує типові виклики API. Вона автоматично обробляє побудову URL і приймає URL безпосередньо як перший аргумент, тоді як useAsyncData потребує унікального ключа та власної функції fetcher. Використовуйте useFetch для простих викликів API, а useAsyncData — для складної логіки fetching.
2Чому рекомендується завжди надавати унікальний ключ під час використання useAsyncData?
Чому рекомендується завжди надавати унікальний ключ під час використання useAsyncData?
Відповідь
Унікальний ключ дозволяє Nuxt ідентифікувати та дедуплікувати запити між сервером і клієнтом під час SSR-гідратації. Без унікального ключа дані можуть бути зайво повторно отримані на клієнті після серверного рендерингу, або можуть виникнути конфлікти caching. Ключ також використовується для caching та керування state.
3Яка різниця між $fetch і useFetch у Nuxt?
Яка різниця між $fetch і useFetch у Nuxt?
Відповідь
$fetch — це службова функція, яка виконує прості HTTP-запити без керування state чи реактивності, схожа на нативний fetch, але з удосконаленнями Nuxt. useFetch — це composable, який повертає реактивні ref (data, pending, error) і обробляє SSR-гідратацію. Використовуйте $fetch для імперативних викликів в обробниках подій, а useFetch — для декларативного fetching у компонентах.
Як увімкнути lazy fetching за допомогою useFetch або useAsyncData?
Як обробляти помилки під час data fetching за допомогою useFetch?
+17 питань зі співбесід
Інші теми співбесід Vue.js / Nuxt.js
Основи JavaScript
Сучасний JavaScript (ES6+)
Основи Vue
Компоненти Vue
Vue Router
Pinia State Management
Vuex (Legacy)
Composition API
Реактивність Vue
Основи Nuxt
SSR і SSG у Nuxt
Серверні маршрути Nuxt
Модулі Nuxt
Composables у Vue
Форми та валідація Vue
Керування станом у Nuxt
Тестування Vue
Розгортання Nuxt та CI/CD
Продуктивність Vue
Просунуті патерни Vue
TypeScript із Vue
Автентифікація Nuxt
SEO з Nuxt
Інтернаціоналізація Nuxt
Архітектура Vue
Безпека Nuxt
Екосистема Vue
Міграція Vue 2→3 та Nuxt 2→3
Опануй Vue.js / Nuxt.js для наступної співбесіди
Отримай доступ до всіх питань, flashcards, технічних тестів, вправ code review та симуляторів співбесід.
Почни безкоштовно