6 replies

How should I use Tanstack query for expensive calculation?

I have an expensive calculation that requires a bunch of parameters to be set beforehand and I would like to run it after a user clicks a button and it will return a big object which I will show in a React component.

function Todos() {
  const { isLoading, isError, data, error, refetch, isFetching } = useQuery({
    queryKey: ['todos'],
    queryFn: fetchTodoList,
    enabled: false,
  })

function Todos() {
  const { isLoading, isError, data, error, refetch, isFetching } = useQuery({
    queryKey: ['todos'],
    queryFn: fetchTodoList,
    enabled: false,
  })

I can disable to query with

enabled: false

enabled: false

as shown in the tanstack query docs and refetch whenever the user clicks the button. But it clearly states this is not the idiomatic way of using tanstack query in the docs. Is there a pattern that I am missing that would allow me to handle expensive queries in a different manner or do I have to use the non-idiomatic way of doing things for this use case?

Solution

From the documentation:

Unlike queries, mutations are typically used to create/update/delete data or perform server side-effects. For this purpose, TanStack Query exports a useMutation hook.

Jump to solution

TTC

Theo's Typesafe Cult•8mo ago•

6 replies

AlpMimaroglu

How should I use Tanstack query for expensive calculation?

function Todos() {
  const { isLoading, isError, data, error, refetch, isFetching } = useQuery({
    queryKey: ['todos'],
    queryFn: fetchTodoList,
    enabled: false,
  })

function Todos() {
  const { isLoading, isError, data, error, refetch, isFetching } = useQuery({
    queryKey: ['todos'],
    queryFn: fetchTodoList,
    enabled: false,
  })

I can disable to query with

enabled: false

enabled: false

Solution

From the documentation:

Unlike queries, mutations are typically used to create/update/delete data or perform server side-effects. For this purpose, TanStack Query exports a useMutation hook.

Jump to solution

How should I use Tanstack query for expensive calculation?

Similar Threads

How should I use Tanstack query for expensive calculation?

Similar Threads

Similar Threads

Similar Threads