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?
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.