Apollo mutation example in a Vue component

PostUpvoter.vue

<script>
import gql from 'graphql-tag';

// GraphQL Mutation with one parameter
const upvoteMutation = gql`
  mutation upvotePost($postId: Int!) {
    upvotePost(postId: $postId) {
      id
      votes
    }
  }
`;

export default {
  // Attribute
  props: {
    // Post id passed down to this component
    postId: {
      type: Number,
      required: true,
    },
  },
  methods: {
    upvote() {
      // Mutation
      this.$apollo.mutate({
        mutation: upvoteMutation,
        variables: {
          postId: this.postId,
        },
      }).then(data => {
        console.log('Done upvoting.');
      });
    },
  },
};
</script>

<template>
  <button @click="upvote">Upvote</button>
</template>

Thanks for the sharing!