我如何 运行 在 router.query 之后查询 GraphQL？

Question

刚开始学习 React 和 Next，但在完成这项工作时遇到了困难。 还尝试使用 useLazyQuery 但无法弄清楚如何正确 return。

...
const TaskSingle = () => {

    const { category } = router.query;

    const { loading, error, data } = useQuery(GET_TASKS, {
        variables: {
            taskFilter: {
                taskCategory: 5, // works
                // taskCategory: category // doesn't work
            },
        },
    });
}

const { categories } = data;

return (
  <div>
  {categories.map((cat) => {
      <div key={cat.id}>
          {cat.name}
      </div>
  })}
 </div>
)

当我尝试使用“类别”而不是数字时出现此错误： http://hidden-url:3000/graphql:1 加载资源失败：服务器响应状态为 400（错误请求）

Answer 1

最后我用了

const category = Number(router.query.category);

而不是

const { category} = router.query;

因为我需要的是数字而不是字符串。