Apollo Client GraphQL查询变量类型错误：必填ID未提供

Hey there, I see exactly what's going wrong here! That error pops up because you're passing a raw string to the variables parameter in your Apollo mutation, but Apollo expects an object with key-value pairs that map to your GraphQL mutation variables.

The Root Cause #

Your GraphQL mutation defines a required variable $id: ID!, but in your Vuex Action, you're passing id.toString() directly as the variables value. This is just a plain string, so Apollo can't associate it with the $id variable your mutation is looking for—hence the "variable not provided" error.

The Fix #

Update the variables parameter to be an object where the key matches the variable name from your mutation (id), and the value is your formatted ID string:

deleteCustomer(vuexContext, id){
  return apollo
    .mutate({
      mutation: DELETE_CUSTOMER,
      variables: { id: id.toString() } // Wrap the ID in an object with the correct key
    })
    .then(()=>{
      vuexContext.commit('deleteCustomer', id.toString());
    })
    .catch((err) => {
      throw err;
    });
}

Why This Works #

GraphQL uses the keys in the variables object to match up with the variables defined in your mutation. By passing { id: id.toString() }, you're explicitly telling Apollo: "Hey, use this string value for the $id variable in my mutation." This clears up the confusion and lets the mutation run as expected.

内容的提问来源于stack exchange，提问作者junaid