Async atoms trong Jotai hoạt động như thế nào?

Async read atom: const userAtom = atom(async (get) => { const id = get(userIdAtom); return await fetchUser(id); }) — component dùng useAtomValue(userAtom) sẽ tự suspend trong khi fetch (cần bọc <Suspense>).

  • Đây là tích hợp với React Suspense tự nhiên nhất trong các state libs. loadable(userAtom) từ jotai/utils trả về { state: 'loading'|'hasData'|'hasError', data, error } — tránh Suspense khi cần kiểm soát loading UI thủ công. atomWithQuery từ jotai-tanstack-query tích hợp TanStack Query vào atom: const postsAtom = atomWithQuery(() => ({ queryKey: ['posts'], queryFn: fetchPosts })).

Pitfall: async atom re-fetch mỗi khi dependency atom thay đổi, không có built-in stale-time như React Query — dùng atomWithQuery nếu cần caching strategy phức tạp.

Xem toàn bộ State Management cùng filter theo level & chủ đề con.

Mở danh sách State Management