Questions tagged [swr]

SWR is a React Hooks library for remote data fetching.

The name “SWR” is derived from stale-while-revalidate, a cache invalidation strategy popularized by HTTP RFC 5861. SWR first returns the data from cache (stale), then sends the fetch request (revalidate), and finally comes with the up-to-date data again.

369 questions
0
votes
1 answer

How to rename variable (data) after destructuring (SWR hook for example)

If I have 2 SWR hooks in same function (or some other hook that has a data variable), export default function Panel() { const { data, error } = useSWR("/api/customer", fetcher); const { data, error } = useSWR("/api/user",…
Digweed
  • 2,819
  • 2
  • 10
  • 7
0
votes
1 answer

Where to implement SWRs pagination for managing pagination in url?

I have been trying to solve the problem that this NextJS application does not have any pagination being handled on the backend so the idea being to pass it to query params in the url, so localhost:3000/patients?page=. I came close with this…
Daniel
  • 14,004
  • 16
  • 96
  • 156
0
votes
1 answer

useswr crashes react component

After adding an SWR data fetch to my react component it crashes, if I comment it out it works fine. I get the following error after uncommenting line const { data } = useSWR(`/api/views/${slug}`, fetcher) Error: Element type is invalid: expected a…
0
votes
0 answers

How to make the call on the server side and keep the functionality

So I have been stuck on this feature for a while, I'm trying to implement pagination in a data that is being fetched from a 3rd party API which is constantly changing, the thing about this API is the calls can only be made on the server, client side…
Kentrell Jr
  • 197
  • 1
  • 15
0
votes
0 answers

I'm having trouble using the useSWR hook in Nextjs

I'm working on a project that uses the useSWR hook inside my pages in Nextjs. I make the request to the rest api provided by Nextjs (/api/..). However my data is always undefined although the api receives the request (there is no error too - its…
0
votes
3 answers

react component constantly fetching and updating data for no reason

I have a react component that I'm fetching data with to visualize. The data fetching is happening constantly, instead of just once as is needed. I was wondering if there is a way to reduce this happening. The component is like this, export default…
LeCoda
  • 538
  • 7
  • 36
  • 79
0
votes
2 answers

Cannot fetch data after refreshing the page in Next.js

I am trying to create a simple Next.js page with the data fetched from backend. For fetching I am using useSWR. If I refresh the page or open it for the first time after running dev, I get a TypeScript error because the data.results (fetched…
Yasir Aydın
  • 5
  • 1
  • 2
0
votes
2 answers

NextJS cors has wrong 'Access-Control-Allow-Origin' value

I noticed an issue after deploying to Netlify, chrome was blocking my ajax requests to a public Apple api, but it was working for the friends I sent a link to. Now it's broken in the opposite direction. It seems like the header is my netlify url…
Ashbury
  • 2,160
  • 3
  • 27
  • 52
0
votes
0 answers

SWR and Jotai integration

I want to use SWR and Jotai together and I have a problem with it! Now I load SWR data in a custom hook and after that load them in Jotai atom with a useEffect! Is there any solution to integrate SWR and Jotai?
0
votes
1 answer

SWR with material UI Data Grid

I am using SWR to get the data to populate the rows of the Data Grid fetcherGet = (url: any) => axios.get(url).then((res: {data: any}) => res.data) let {data: customers = []} = useSWR( [ROUTES.GET_CUSTOMERS_BY_ROUTE], fetcherGet ) …
Mac Fly
  • 359
  • 1
  • 7
  • 22
0
votes
2 answers

Next.js Dynamic Page using useSWR

I want to create dynamic pages based on the ID of a Saloon profile using useSWR and useRouter, but the data loads in after the pages are rendered. This is my code: import useSWR from "swr"; import { useRouter } from "next/router"; const fetcher =…
Mathias Riis Sorensen
  • 504
  • 3
  • 13
  • 34
0
votes
0 answers

Why do I get a cors error when parsing an object

Hi I am currently working on an app that's setting items in localStorage then later retrieve all items. When retrieving I am parsing the object to convert it from a stringified object to an object. On doing that I am getting this error, Error: A…
0
votes
1 answer

How to paginate unpaginated data with SWR

Let's say you have some data that is fetched from an api. It all comes in in one chunk, unpaginated. I am using vercel's SWR library. Is there a way to paginate this data client-side? useSWRInfinite relies on the fact that the link that you provide…
Luca Adrian
  • 75
  • 1
  • 7
0
votes
1 answer

SWR seems to cache two different requests under same cache key. How do I fix this?

I use Axios as fetcher for SWR like this: // axios.js import axios from 'axios'; // Create axios instance. const axiosInstance = axios.create({ baseURL: process.env.API_URL, withCredentials: true, xsrfCookieName: 'csrftoken', …
Odif Yltsaeb
  • 5,575
  • 12
  • 49
  • 80
0
votes
1 answer

Am I passing headers wrong in SWR

It's be a while since I was doing any sort of coding and I am coming back to help a friend with the creation of a site. However jumping straight into the depend I am now stuck with SWR. Problem I am just trying to send a Authorization: Bearer …
MatDoak
  • 132
  • 5
  • 17