const { data } = useQuery 问题:我希望数据最初是对象

const { data } = useQuery problem: I want data to be object initially

我正在尝试为我的 React 应用程序实现登录功能。

import React, { useState, useEffect } from 'react'
import { useQuery, useLazyQuery, useMutation } from "@apollo/client"
import { useForm } from "react-hook-form"
import { LOGIN } from '../queries/queries'

const Login = () => {

   const [formValue, setFormValue] = useState({})
   const { loading, error, data } = useQuery(LOGIN, {
      variables: {
         email: formValue.email,
         password: formValue.password
      }
   })


   const { register, handleSubmit } = useForm()
   const onSubmit = (value) => {
      setFormValue(value)
   }



   if (loading) return <p>loading</p>


   return(
      <>
         <form onSubmit={handleSubmit(onSubmit)} >
            <input 
               type="text"
               name="email"
               placeholder="E-mail"
               ref={register}
            />
            <input 
               type="password"
               name="password"
               placeholder="Password"
               ref={register}
            />
            <button type="submit">
               Login
            </button>
         </form>
      </>
   )
}

例如,当我编写 console.log(data.user) 代码时,会发生错误,因为 user 不是未定义的。 我知道如果我直接对变量进行编码,我可以从 data 获取对象,但我想在 handleSubmit 之后获取它。

我想如果我一开始就可以创建 data 对象,错误就不会发生。 那有什么办法吗?

在引用该对象属性时尝试使用“data?.user”而不是“data.user” 如果对象不存在,问号应该禁用错误

更新: 您还可以尝试将数据声明为空对象文字: { 加载、错误、数据 = {} }