swr
v2.3.0
O SWR é uma biblioteca de ganchos do React para busca de dados.
O nome “ SWR ” é derivado de stale-while-revalidate -uma estratégia de invalidação de cache popularizada pelo HTTP RFC 5861. O SWR primeiro retorna os dados do cache (Stale) e depois envia a solicitação (revalidate) e finalmente vem com os dados atualizados novamente.
Com apenas um gancho, você pode simplificar significativamente a lógica de busca de dados em seu projeto. E também abordou todos os aspectos de velocidade, correção e estabilidade para ajudá -lo a criar melhores experiências:
... e muito mais.
Com o SWR, os componentes receberão um fluxo de atualizações de dados constantemente e automaticamente . Assim, a interface do usuário será sempre rápida e reativa .
Veja a documentação completa e os exemplos no swr.vercel.app.
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 >
} Neste exemplo, o gancho React useSWR aceita uma key e uma função fetcher . A key é um identificador exclusivo da solicitação, normalmente o URL da API. E o fetcher aceita key como seu parâmetro e retorna os dados de forma assíncrona.
useSWR também retorna 3 valores: data , isLoading e error . Quando a solicitação (Fetcher) ainda não estiver concluída, data serão undefined e isLoading será true . Quando obtemos uma resposta, ele define data e error com base no resultado do fetcher , isLoading para false e renderiza o componente.
Observe que fetcher pode ser qualquer função assíncrona, você pode usar sua biblioteca de dados favorita para lidar com essa parte.
Veja a documentação completa e os exemplos no swr.vercel.app.
Esta biblioteca é criada pela equipe por trás do Next.js, com contribuições de nossa comunidade:
Colaboradores
Obrigado a Ryan Chen por fornecer o incrível nome do pacote swr NPM!
A licença do MIT.
