0

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", fetcher);
...
data.map(...)
}

both of them have a data variable. How can I rename 1 data to something else so they don't replace each other?

As an option:

const { data, error } = useSWR("/api/customer", fetcher);
const dataHook1 = data;
const { data, error } = useSWR("/api/user", fetcher);
const dataHook2 = data;
...

but it doesn't look nice, maybe there are other options?

Digweed
  • 2,819
  • 2
  • 10
  • 7

1 Answers1

1

you can try destructuring and rename property

export default function Panel() {
    const { data: data1, error: error1 } = useSWR("/api/customer", fetcher);
    const { data: data2, error: error2 } = useSWR("/api/user", fetcher);
    ...
    data.map(...)
}

and can access as data1, error1 and data2, error2.

MORÈ
  • 2,480
  • 3
  • 16
  • 23