# ApolloMutation component


  :mutation="gql => gql`
    mutation DoStuff ($name: String!) {
      someWork (name: $name) {
  <template v-slot="{ mutate, loading, error }">
    <button :disabled="loading" @click="mutate()">Click me</button>
    <p v-if="error">An error occurred: {{ error }}</p>

# Props

  • mutation: GraphQL query (transformed by graphql-tag) or a function that receives the gql tag as argument and should return the transformed query
  • variables: Object of GraphQL variables
  • optimisticResponse: See optimistic UI
  • update: See updating cache after mutation
  • refetchQueries: See refetching queries after mutation
  • clientId: id of the Apollo Client used by the query (defined in ApolloProvider clients option)
  • tag: String HTML tag name (default: div); if undefined, the component will be renderless (the content won't be wrapped in a tag)
  • context: See apollo context

# Scoped slot props

  • mutate(options = undefined): Function to call the mutation. You can override the mutation options (for example: mutate({ variables: { foo: 'bar } }))
  • loading: Boolean indicating that the request is in flight
  • error: Eventual error for the last mutation call
  • gqlError: first GraphQL error if any

# Events

  • done(resultObject)
  • error(errorObject)
  • loading(boolean)