import Callout from 'nextra-theme-docs/callout'
const { data, error } = useSWR(key, fetcher)
Это самый фундаментальный API SWR. fetcher
здесь представляет собой асинхронную функцию, которая принимает key
SWR и возвращает данные.
Возвращаемое значение будет передано как data
, и если оно будет выброшено, оно будет перехвачено как error
.
fetcher
можно не указывать в параметрах, если он{' '}
[предоставляется глобально](/docs/global-configuration).
Вы можете использовать любую библиотеку для обработки выборки данных, например, полифил fetch
— developit/unfetch:
import fetch from 'unfetch'
const fetcher = url => fetch(url).then(r => r.json())
function App () {
const { data, error } = useSWR('/api/data', fetcher)
// ...
}
Новые встроенные полифилы: fetch(), URL, и Object.assign
import axios from 'axios'
const fetcher = url => axios.get(url).then(res => res.data)
function App () {
const { data, error } = useSWR('/api/data', fetcher)
// ...
}
Или используйте GraphQL с такими библиотеками, как graphql-request:
import { request } from 'graphql-request'
const fetcher = query => request('/api/graphql', query)
function App () {
const { data, error } = useSWR(
`{
Movie(title: "Начало") {
releaseDate
actors {
name
}
}
}`,
fetcher
)
// ...
}
Если вы хотите передавать переменные в запрос GraphQL, ознакомьтесь с разделом Множественные аргументы.