SWR 是一个极简的 API,内置缓存、重新验证和请求去重功能。只需一个 React Hook,即可让您的 UI 保持快速、一致且始终最新。
向 useSWR 传递一个 key 和 fetcher。该 Hook 会管理请求、缓存响应并保持数据新鲜。您会获得 data、error 和 isLoading 来驱动您的 UI。
import useSWR from 'swr'
function Profile() {
const { data, error, isLoading } = useSWR('/api/user', fetcher)
if (error) return <div>failed to load</div>
if (isLoading) return <div>loading...</div>
return <div>hello {data.name}!</div>
}SWR 在速度、正确性和稳定性等各个方面为您提供支持,帮助您构建更好的体验。
小巧的 API 表面,支持任何数据源 — REST、GraphQL 或自定义 fetcher。
自动后台重新验证、聚焦/重连更新,以及用于分页和流式传输的工具。
为 Suspense 构建,与 SSR 和 SSG 兼容,从一开始就完全类型化。