ApolloQuery

home.vue

<template>
  <div>
    <h2>유저 리스트</h2>
    <div v-for="user in userList" :key="user.id">
      {{ user.id }} {{ user.name }} {{ user.age }}
    </div>
  </div>
</template>

<script lang="ts">
import Vue from "vue";
import gql from "graphql-tag";

export default Vue.extend({
  name: "UserList",
  data() {
    return {
      userList: [],
    };
  },
  apollo: {
    userList: {
      query: gql`
        query users {
          users {
            id
            name
            age
          }
        }
      `,
      update: (data) => data.users,
    },
  },
});
</script>