Компонент Vue.js не отображает объект Postgres / knex / Objection

Question

У меня есть Express API, использующий Knex / Objection.js для запросов, использующий интерфейс Vue.

В приложении сообщения принадлежат группе, так что каждое сообщение имеет идентификатор_группы, соответствующий группе.это принадлежит.У каждой группы есть атрибут имени.

Я хочу отобразить post.group.name, чтобы получить имя группы, к которой принадлежит сообщение.Однако post.group возвращает undefined.

Вот моя модель Post:

const BaseModel = require("./BaseModel");

// const Password = require('objection-password')();

class Post extends BaseModel {
  static get tableName() {
    return "posts";
  }

  static get relationMappings () {
    const User = require('./User');
    const Group = require('./Group')
    return {
      user: {
        relation: BaseModel.BelongsToOneRelation,
        modelClass: User,
        join: {
          from: 'posts.users_id',
          to: 'users.id'
        }
      }, 
      group: {
        relation: BaseModel.BelongsToOneRelation,
        modelClass: Group,
        join: {
          from: 'posts.groups_id',
          to: 'groups.id'
        }
      }
    }
  }
}

module.exports = Post;

Вот мой экспресс-маршрут:

router.get('/:id', async (req, res, next) => {
  var id = req.params.id;
  let results = await Post.query().findById( id ).eager('group');
  res.json(results);
});

А вот и компонент(обратите внимание, что post.user.username работает нормально):

<template>
  <div class="event">
    <div class="label">
      <img :src="post.user.avatar_url" />
    </div>
    <div v-if="!!post.user" class="content">

      <div class="summary">
        <router-link :to="`/users/${post.user.id}`">
          {{ post.user.name }}
          <small>{{ `@${post.user.username}` }}</small>
        </router-link>
        [<router-link :to="`/groups/${post.groups_id}`">
          <small>{{ post.group.name }}</small>
        </router-link>]
        <div class="date">{{ post.created_at | timeAgo }}</div>
      </div>
      <router-link :to="`/${post.user.username}/status/${post.id}`">
        <div class="extra text">{{ post.body }}</div>
      </router-link>
    </div>
    <div class="">
      <div class="btn" flat color="grey" @click="deletePost(post.id)">
        <i class="fa fa-trash " ></i>
        <span>Delete</span>
      </div>
    </div>
  </div>
</template>

<script>
import PostsService from '../../services/PostsService'
export default {
  name: "Post",
  props: {
    post: {
      type: Object,
      required: true
    }
  },
  methods: {
    deletePost: async function (id) {
      let response = await PostsService.deletePost(id)
        console.log('this is the repsonse b4 emit deleted', response);
      if (response.status === 200) {
        console.log('post deleted, about to emit');
        this.$emit('post-deleted');
      }
    }
  }
};
</script>