我需要在我的组件的多个函数中使用我的变量，但似乎无法访问它

Question

这是我的代码示例。

 let appointment


const [AddMemberTitle] = useMutation(ADD_MEMBER_TITLE_MUTATION)
  const [CreateMember] = useMutation(CREATE_MEMBER_MUTATION, {
    onCompleted: (newMemberData) => {
      setMemberId(newMemberData.CreateMember.id)

     //run some code using the Member id and the values from my Formik component and the appointment variable
    },
  })


 const onSubmit = async (values, onSubmitProps) => {
 appointment = values.appointment

CreateMember({
      variables: {
        firstName: values.firstName,
        middleName: values.middleName,
        lastName: values.lastName,
        gender: values.gender,
        phoneNumber: values.phoneNumber,
        whatsappNumber: values.whatsappNumber,
        email: values.email,
        dob: values.dob,
        maritalStatus: values.maritalStatus,
        occupation: values.occupation,
      },
    })
}
 return (
//Then my jsx goes here
)

其余代码按预期工作，我只需要使用 CreateMember 突变运行之后生成的信息运行 AddMemberTitle 突变.

我尝试在组件的顶层创建一个变量，我可以在 onSubmit 中为其赋值，但我无法在 onCompleted 中使用它Create Member

的函数

Answer 1

（少数）解决方案之一可以使用从突变调用函数返回的承诺（CreateMember 从 useMutation 挂钩返回）。

您可以使用 await 或 .then() 语法：

const onSubmit = async (values, onSubmitProps) => {
  const { 
    appointment, 
    otherFormikValue,
    ...rest // assuming only CreateMember values and mutation names matching
  } = values;
  const { data: newMemberData } = await CreateMember({ variables: {...rest} });
  const { data: someData } = await InsertAppointmentMember(
    { variables: {
       memberId: newMemberData.CreateMember.id,
       appointmentId: appointment.id
  } });

我需要在我的组件的多个函数中使用我的变量，但似乎无法访问它

I need to use my variable in multiple functions in my component, but can't seem to access it

reactjs

graphql

formik