"Quaere" 是一个 React 的原子化服务端状态管理库。

Quaere 的核心实现来自于 Tanstack Query (opens in a new tab)，但去除了 queryKey 概念，API 设计类似于 Jotai (opens in a new tab)，提供了一套声明式的、原子化的状态管理方案，帮助你高效地管理服务端状态。

🕊️
  • 极速、轻量、可重用的 数据请求
  • 内置 缓存 和重复请求去除
  • 实时 体验
  • 传输和协议不可知
  • 支持 SSR / ISR / SSG
  • 支持 TypeScript
  • React Native

入门 · 示例 · GitHub 仓库 (opens in a new tab)

快速开始

import { query, useQuery } from "quaere";
 
const userQuery = query({ fether: () => fetch("/api/user") });
 
function Profile() {
  const { data, error, isLoading } = useQuery({
    query: userQuery,
  });
 
  if (error) return <div>failed to load</div>;
  if (isLoading) return <div>loading...</div>;
  return <div>hello {data.name}!</div>;
}

该示例中，query hook 接受一个函数 fetcher。fetcher 可以是任何返回数据的异步函数，你可以使用原生的 fetch 或 Axios 之类的工具。