Query Functions

1
useQuery({ queryKey: ['todos'], queryFn: fetchAllTodos })
2
useQuery({ queryKey: ['todos', todoId], queryFn: () => fetchTodoById(todoId) })
3
useQuery({
4
  queryKey: ['todos', todoId],
5
  queryFn: async () => {
6
    const data = await fetchTodoById(todoId)
7
    return data
8
  },
9
})
10
useQuery({
11
  queryKey: ['todos', todoId],
12
  queryFn: ({ queryKey }) => fetchTodoById(queryKey[1]),
13
})

1
const { error } = useQuery({
2
  queryKey: ['todos', todoId],
3
  queryFn: async () => {
4
    if (somethingGoesWrong) {
5
      throw new Error('Oh no!')
6
    }
7
    if (somethingElseGoesWrong) {
8
      return Promise.reject(new Error('Oh no!'))
9
    }
10

11
    return data
12
  },
13
})

1
useQuery({
2
  queryKey: ['todos', todoId],
3
  queryFn: async () => {
4
    const response = await fetch('/todos/' + todoId)
5
    if (!response.ok) {
6
      throw new Error('Network response was not ok')
7
    }
8
    return response.json()
9
  },
10
})

1
function Todos({ status, page }) {
2
  const result = useQuery({
3
    queryKey: ['todos', { status, page }],
4
    queryFn: fetchTodoList,
5
  })
6
}
7

8
// Access the key, status and page variables in your query function!
9
function fetchTodoList({ queryKey }) {
10
  const [_key, { status, page }] = queryKey
11
  return new Promise()
12
}