Reactjs 调用函数后如何获取useLazyQuery挂钩数据

我试图在提交表单/onClick后调用useLazyQuery，但由于某些原因，我总是无法定义。以下是我如何定义我的钩子

const component = () => {
 const [getMyValues, {loading, error, data: myValues}] = useLazyQuery(GET_MY_VALUES);
 
 onSubmit = async () => {
   if(checkCondition){
     const someData = await getMyValues({ variables: {o: names } });
     console.log({someData})    //undefined
   }
 }
}

---

如何获取

someData

变量中的查询数据？

您需要依赖useLazyQuery中的myValues

因此，如果您想将查询结果分配给某个数据，您需要像这样做

const component = () => {
 const [getMyValues, {loading, error, data: myValues}] = useLazyQuery(GET_MY_VALUES);
 
 const someData = myValues;
 console.log({someData})
 onSubmit = () => {
   if(checkCondition){
     getMyValues({ variables: {o: names } });
   }
 }
}

---

因此，当getMyValues加载结果时，它将重新呈现组件，数据将从myValues更新：

找到了一个解决方案，但我还没有试过，也许你可以试一下。

useLazyQuery不会返回承诺，您应该使用

onCompleted

函数参数，如下所示：

const [getMyValues, {loading, error, data: myValues}] = useLazyQuery(GET_MY_VALUES, {
  onCompleted: someData => {
    console.log(someData)
    /* do your staff */
  }
});

// It's equal with someData 
// when `getMyValues` ​​is executed, the response data will be 
// return to `myValues`, so you can also use it.
React.useEffect(() => {
  console.log(myValues)
}, [myValues])
 
onSubmit = () => {
  if(checkCondition){
    getMyValues({ variables: {o: names } });
  }
}

在调用getMyValues（）之后有没有一种方法可以使用.then（）？我尝试过使用它，但出现了一个错误。正如这里提到的，getMyValues实际上并不是一个承诺。所以你既不能打电话，也不能等待答复