你可以使用多个参数，你可以使用一个数组作为useSWR react钩子的key参数。

import React from "react";
import { request } from "graphql-request";
import useSWR from "swr";

const fetcher = (query, variables) => {
  console.log(query, variables);
  return request(`https://graphql-pokemon.now.sh`, query, variables);
};
export default function Example() {
  const variables = { code: 14 };
  const { data, error } = useSWR(
    [
      `query GET_DATA($code: String!) {
          getRegionsByCode(code: $code) {
            code
            name
          }
        }`,
      variables,
    ],
    fetcher
  );

  if (error) return <div>failed to load</div>;
  if (!data) return <div>loading...</div>;
  return <pre>{JSON.stringify(data, null, 2)}</pre>;
}

函数fetcher仍然接受相同的两个参数：query和variables。

作者在这里！
同意这是一个关键的功能，这就是为什么从v1.1.0开始，SWR密钥将自动稳定地序列化。你可以安全地做到这一点：

useSWR(['query ...', variables], fetcher)

虽然variables可以是一个JavaScript对象（可以嵌套，也可以是一个数组），但它不会导致任何不必要的重新呈现。此外，序列化过程是稳定的，因此以下键是相同的，没有额外的请求：

// Totally OK to do so, same resource!
useSWR(['query ...', { name: 'foo', id: 'bar' }], fetcher)
useSWR(['query ...', { id: 'bar', name: 'foo' }], fetcher)

你也可以直接传递一个对象作为key，它会被传递给fetcher：

useSWR(
  {
    query: 'query ...',
    variables: { name: 'foo', id: 'bar' }
  },
  fetcher
)

你可以通过安装最新版本的SWR来尝试一下，如果有任何问题请告诉我：）

slideshowp2的解决方案对我没有帮助，因为它导致了一个无限循环。
不要将对象传递给useSWR函数，因为它们在每次重新渲染时都会改变。直接传递变量：

const fetcher = (query, variables) => {
  console.log(query, variables);
  return request(`https://graphql-pokemon.now.sh`, query, variables);
};
export default function Example() {
  const { data, error } = useSWR(
    [
      `query GET_DATA($code: String!) {
          getRegionsByCode(code: $code) {
            code
            name
          }
        }`,
      14,
    ],
    (query, coder => fetcher(query, { code })
  );

  if (error) return <div>failed to load</div>;
  if (!data) return <div>loading...</div>;
  return <pre>{JSON.stringify(data, null, 2)}</pre>;
}

我花了一段时间试图在这篇文章中实现“最佳答案”解决方案，但它根本不起作用。经过大量的调试和遵循swr's docs提供的指南，我终于得到了以下解决方案：
(note我决定使用一个元组，但你可以做任何事情）

import useSWR from "swr";
 import { request } from "graphql-request";

 
 // fetcher
 const fetcher = (url: string, token: any) => {
    return request(url, token[0], token[1]);
  };

  // shape of request
  const token = [
    `query Lesson($lessonId: ID!) {
      lesson(id: $lessonId) {
        _id
        title
        description
        bookmarked
      }
    }`,
    variables,
  ];

  // swr hook
  const { data } = useSWR(["http://localhost:4000/", token], ([url, token]) =>
    fetcher(url, token)
  );