TanStackT
TanStack2y ago
13 replies
thick-teal

Migrated from v4 to v5, don't know how to use it without onSucess

I have tried removing the onSuccess as I should, and then including it in the an independent useEffect, but the content renders for a split second and disappears.

export default function Facturados() {
 const [desde, setDesde] = useState(router.query.desde || '')
 const [hasta, setHasta] = useState(router.query.hasta || '')
 const [query, setQuery] = useState(false)

//here is my main issue
  const getFacturas = useQuery({
    queryKey: ['facturas', query],
    queryFn: () =>
      axiosFetcherFacturasBetweenDates(
        '/api/analisis-facturas-api',
        desde,
        hasta,
        tienda
      ),
    enabled: !!query,
    keepPreviousData: true,
    refetchOnWindowFocus: false,
    onSuccess: () => {
      setQuery(false)
    }
  })

const handleSearch = async (e) => {
    e.preventDefault()
    setQuery(true)

    if (session.role.includes('ADMIN')) {
      router.push({
        query: { desde, hasta, tienda }
      })
    } else {
      router.push({
        query: { desde, hasta }
      })
    }
  }

useEffect(() => {
    if (router.query.desde && router.query.hasta && router.query.tienda) {
      setQuery(true)
    }
  }, [router.query.desde, router.query.hasta, router.query.tienda])

  if (getFacturas.isFetching) return <Loading />
Was this page helpful?