Reactjs react自定义钩子内部的Apollo GraphQL查询

我试图列出Rick&Morty API中的所有角色。我编写了下面的钩子，以便在我的组件中使用，该组件将呈现结果。当我硬编码值时，例如：page:1，filter:{name:Rick}查询运行正常。如果我尝试使用变量，它会返回一个错误400错误请求。我假设这意味着我的$page/$filter值无效，我尝试检查它们中的值+它们的类型一切似乎都很好。我查看了文档，并确保使用了正确的语法将变量注入查询。该查询来自Rick&Morty API官方文档。非常感谢任何指导/指示

UseChareCerterList挂钩 参数：页码：编号|过滤器：字符串

从'@apollo/client'导入{useQuery，gql}； 常量字符列表=gql` 查询$page:Number$过滤器：字符串！{ 人物 页面：$page，筛选器：{name:$filter}{ 信息{ 下一个 上 } 结果{ 身份证件 名称 形象 } } } `; 导出默认函数useCharecterList{page，filter}{ 返回UseQuerySharecters\u列表{ 变量：{page，filter} };

---

} 我想出来了。。。像个白痴一样，我假设查询类型只是普通的JS类型。经过一番挖掘，我让它工作如下

从'@apollo/client'导入{useQuery，gql}； 常量字符列表=gql` 查询字符列表$page:Int$过滤器：过滤器角色！{ 人物 页面：$page，过滤器：$filter{ 信息{ 下一个 上 } 结果{ 身份证件 名称 形象 } } } `; 导出默认函数useCharecterListoptions{ 返回UseQuerySharecters\u列表、选项；

---

} 我想出来了。。。像个白痴一样，我假设查询类型只是普通的JS类型。经过一番挖掘，我让它工作如下

从'@apollo/client'导入{useQuery，gql}； 常量字符列表=gql` 查询字符列表$page:Int$过滤器：过滤器角色！{ 人物 页面：$page，过滤器：$filter{ 信息{ 下一个 上 } 结果{ 身份证件 名称 形象 } } } `; 导出默认函数useCharecterListoptions{ 返回UseQuerySharecters\u列表、选项；

---

}使用“查询变量”选项在操场中进行测试。。。详细检查网络请求和响应SuseCharacterListVars{return UseQuerySharecters_LIST，{variables:vars？…但是前面的应该也可以…错误的变量$filter type-它必须匹配/API规范…一如既往，没有在游乐场中测试；在游乐场中使用'query variables'选项进行测试…详细检查网络请求和响应SuseCharacterListVars{return UseQuerySharecters\u LIST，{variables:vars？…但是前面的应该也可以…糟糕的变量$filter类型-它必须匹配/API规范…一如既往，没有在操场上测试过；无用的钩子/构造…从单独的.graphql文件加载/导入查询就足够了，使用普通的UseQuerySeless钩子/构造就足够了…从单独的.graphql文件加载/导入查询就足够了.graphql文件并使用普通useQuery