如何在GraphQL中进行异步查询?

Question

我正在调用1查询和突变。突变工作得很好，但是当我从我的查询得到响应时，我需要将用户重定向到另一个页面，但是在我的情况下，该函数在我得到响应之前被触发。我该如何预防呢?

const renderData = async () => {
const currentUserId = await data?.signInUserSession?.idToken
?.payload?.sub;
const isAdmin = await data?.signInUserSession?.idToken?.payload[
"custom:role"
];
localStorage.setItem("userId", currentUserId);
if (
currentUserId !== null &&
currentUserId !== undefined &&
currentUserId !== ""
) {
Auth.currentSession().then((data) => {
setData({
variables: {
updateUserInput: {
id: currentUserId,
firstName: data.getIdToken().payload.given_name,
lastName: data.getIdToken().payload.family_name,
},
},
});
});
isCodeValid({
variables: {
validateUserVerificationCodeInput: {
user: {
id: currentUserId,
},
},
},
});

if (isAdmin === "admin" && isUserCodeValid) {
history.push("/managements");
} else if (
isUserCodeValid !== undefined &&
isUserCodeValid === true
) {
history.push("/verification");
} else if (isUserCodeValid) {
history.push("/stripe");
}
}
};

isUserCodeValid - is a response from query

Answer 1

useMutation为这种情况提供了onCompleted和refetchQueries选项。很难为你的情况写一个精确的解决方案，因为不是所有的代码都是可见的，但我相信下面的例子可以帮助:

const [addProduct, { data, loading, error }] = useMutation(
createProductMutation
);
const onFinish = async (fieldNames) => {  

await addSpending({
variables: { ...others, ...fieldNames},
refetchQueries: [{ query: calledQuery }],
onCompleted: (data) => {
// your logic 
},
});
if (!error) {
form.resetFields();
onFinishSave(true);
}
};