Nic*_*ord 6 reactjs graphql apollo-client
将变量传递到 useQuery 钩子时遇到一个奇怪的问题。
查询:
const GET_USER_BY_ID= gql`
query($id: ID!) {
getUser(id: $id) {
id
fullName
role
}
}
`;
Run Code Online (Sandbox Code Playgroud)
调用查询:
const DisplayUser: React.FC<{ id: string }> = ({ id }) => {
const { data, error } = useQuery(GET_USER_BY_ID, {
variables: { id },
});
return <div>{JSON.stringify({ data, error })}</div>;
};
Run Code Online (Sandbox Code Playgroud)
渲染组件:
<DisplayUser id="5e404fa72b819d1410a3164c" />
Run Code Online (Sandbox Code Playgroud)
这会产生错误:
"Argument \"id\" of required type \"ID!\" was provided the variable \"$id\" which was not provided a runtime value."
Run Code Online (Sandbox Code Playgroud)
从 GraphQL Playground 调用查询返回预期结果:
{
"data": {
"getUser": {
"id": "5e404fa72b819d1410a3164c",
"fullName": "Test 1",
"role": "USER"
}
}
}
Run Code Online (Sandbox Code Playgroud)
并在没有变量的情况下调用查询,而是对 id 进行硬编码:
const GET_USER_BY_ID = gql`
query {
getUser(id: "5e404fa72b819d1410a3164c") {
id
fullName
role
}
}
`;
const DisplayUser: React.FC = () => {
const { data, error } = useQuery(GET_USER_BY_ID);
return <div>{JSON.stringify({ data, error })}</div>;
};
Run Code Online (Sandbox Code Playgroud)
还返回预期的结果。
我还试图测试一个类似的查询,它firstName: String!作为一个参数,它也会产生一个错误,指出该变量没有提供运行时值。在对查询字符串中的值进行硬编码时,此查询也按预期工作。
该项目今天和用途开始"apollo-boost": "^0.4.7","graphql": "^14.6.0"和"react-apollo": "^3.1.3"。
[解决了]
在阅读堆栈跟踪时,我注意到问题是引用graphql-query-complexity我用于验证规则的问题。我删除了验证规则,现在一切正常!当然,我目前没有验证,但至少我可以从这里开始工作。感谢所有花时间回复的人!
| 归档时间: |
|
| 查看次数: |
2645 次 |
| 最近记录: |