是否可以使用 useSWR 根据用户角色调用 API？

Question

我想知道如果条件是 true 是否可以使用 Vercel 的 useSWR？即，如果 RoleOne 为真，则调用：

let { data: roleOneData, error: roleOneError } = useSWR(
    "/api/getRoleOneInfo",
    fetcher
  )

我的 Next.js 应用程序正在处理不同的用户角色，所有用户角色都共享同一个应用程序 Shell，这意味着我调用所有用户角色特定的 API应用程序 Shell。如果可以看到特定用户角色为真，我只想调用我需要的 API 。我正在从 userData API.

中获取角色

以下是我在各种功能中使用的提取器：

let { data: userData, error: userError } = useSWR("/api/getUserInfo", fetcher)

let { data: roleOneData, error: roleOneError } = useSWR(
    "/api/getRoleOneInfo",
    fetcher
  )

let { data: roleTwoData, error: roleTwoError } = useSWR(
    "/api/getRoleTwoInfo",
    fetcher
  )

如果我以 RoleOne 身份登录，我会收到 getRoleTwoInfo 的 API 错误，反之亦然。如果我以 RoleOne 身份登录，我想避免调用 RoleTwo API，反之亦然。我怎样才能做到这一点？

Answer 1

绝对有可能，并在文档的 this page 中进行了描述。

当您不希望请求发生时，您只需将密钥（在您的情况下是请求的 url）设为假即可。

let { data: userData, error: userError } = useSWR("/api/getUserInfo", fetcher)

let { data: roleOneData, error: roleOneError } = useSWR(
    userData?.role === "one" ? "/api/getRoleOneInfo" : null,
    fetcher
  )

let { data: roleTwoData, error: roleTwoError } = useSWR(
    userData?.role === "two" ? "/api/getRoleTwoInfo" : null,
    fetcher
  )

是否可以使用 useSWR 根据用户角色调用 API？

Is it possible to call an API based on user roles with useSWR?

javascript

next.js

vercel