Vue Apollo: как отображать данные Mysql во внешнем интерфейсе VueJS с помощью GraphQL

Я новый разработчик в разработке VueJS и NodeJS.

Я использую apollo-boost,graphql,vue-apollo для передней части и Я использую express-graphql, express, graphql, knex, MySQL для бэкэнд-раздела.

После запуска бэкэнд-раздела я получаю правильный ответ, как показано ниже: Входной параметр

{
  users {
    id,
    name,
    email
  }
}

Выход:

{
  "data": {
    "users": [
      {
        "id": "1",
        "name": "test",
        "email": "[email protected]"
      },
      {
        "id": "2",
        "name": "test2",
        "email": "[email protected]"
      }
    ]
  }
}

Поэтому я думаю, что код в порядке на стороне сервера. Теперь я хочу отобразить эти данные в vuejs. Я реализовал код, как показано ниже:

<template lang = "pug">
  div
    .home
      img(alt='Vue logo', src='../assets/logo.png')
    div(style = "text-align: left; padding: 20px 60px")
      div getTodos: {{ users }}
      div(v-for = "users in users")
        h4 {{ users.name }}
</template>

<script>
// @ is an alias to /src
import { gql } from 'apollo-boost';

export default {
  name: 'Home',
  components: {},
  apollo: {
    users: {
      query: gql`
        query {
          users {
            id
            name
            email
          }
        }
      `,
    },
  },
};
</script>

<style>
.w-100 {
  width: 100%;
}
</style>

Я не получаю никаких ошибок, но никаких результатов для отображения в разделе внешнего интерфейса. Пожалуйста, дайте мне знать, что происходит не так?