如何在解构后重命名变量（数据）（例如 SWR 钩子）

Question

如果我在同一函数中有 2 个 SWR 挂钩（或其他具有数据变量的挂钩），

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

他们都有一个数据变量。我怎样才能将 1 个数据重命名为其他名称，这样它们就不会相互替换？

作为一个选项：

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

但看起来不太好，也许还有其他选择？

Answer 1

你可以试试解构和重命名属性

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

并且可以作为 data1、error1 和 data2、error2 访问。

如何在解构后重命名变量（数据）（例如 SWR 钩子）

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

javascript

reactjs

react-hooks

next.js

swr