index.es-ES.mdx

title
Biblioteca React Hooks para la obtención de datos

import { Callout } from 'nextra-theme-docs'; import Features from "components/features"; import { Bleed } from 'nextra-theme-docs'

{ // wrapped with {} to mark it as javascript so mdx will not put it under a p tag } {

SWR

}

El nombre “SWR” es derivado de stale-while-revalidate, una estrategia de invalidación de caché HTTP popularizada por HTTP RFC 5861. SWR es una estrategia para devolver primero los datos en caché (obsoletos), luego envíe la solicitud de recuperación (revalidación), y finalmente entrege los datos actualizados.

Con SWR, el componente obtendrá constante y automáticamente el último flujo de datos.
Y la interfaz de usuario será siempre rápida y reactiva.

[Get Started](/docs/getting-started) · [Examples](/examples/basic) · [Blog](/blog) · [GitHub Repository](https://github.com/vercel/swr)

Resumen [#overview]

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>
}

En este ejemplo, el hook useSWR acepta una key que es un cadena y una función fetcher. key es un indentificador único de los datos (normalmente la URL de la API) y pasará al fetcher. El fetcher puede ser cualquier función asíncrona que devuelve datos, puedes utilizar el fetch nativo o herramientas como Axios.

El hook devuelve 2 valores: data y error, basados en el estado de la solicitud.

Características [#features]

Con una sola línea de código, puede simplificar la obtención de datos en su proyecto, y tambien tiene todas estas increíbles características fuera de caja:

• Obtención de datos rápida, ligera y reutilizable
• Caché integrada y deduplicación de solicitudes
• Experiencia en tiempo real
• Agnóstico al transporte y al protocolo
• SSR / ISR / SSG support
• TypeScript ready
• React Native

SWR le cubre en todos los aspectos de velocidad, correción, y estabilidad para ayudarle a construir mejores experiencias:

• Navegación rápida por la página
• Polling on interval
• Dependencia de los datos
• Revalidation on focus
• Revalidation on network recovery
• Mutación local (Optimistic UI)
• Smart error retry
• Pagination and scroll position recovery
• React Suspense

And lot more.

Comunidad [#community]

SWR es creado por el mismo equipo que esta detrás de Next.js, el framework de React. Sigan @vercel en Twitter para futuras actualizaciones del proyecto.

Sientase libre de unirse a discusiones en GitHub!