Categories.vue

<template>
  <div>
    <v-card
      v-for="category in categories"
      :key="category.idCategory"
      class="mx auto"
      max-width="344"
    >
      <v-img class="white--text align-end" :src="category.strCategoryThumb">
        <v-card-title>{{ category.strCategory }}</v-card-title>
      </v-img>
      <v-card-subtitle class="pb-0">{{
        category.strCategoryDescription
      }}</v-card-subtitle>
    </v-card>
  </div>
</template>

<script>
export default {
  name: 'Categories',
  data() {
    return {
      categories: []
    };
  },
  created() {
    this.getCategories();
  },
  methods: {
    getCategories() {
      const categories = [
        { idCategory: 1, strCategory: 'test1' },
        { idCategory: 2, strCategory: 'test2' },
        { idCategory: 3, strCategory: 'test3' }
      ];
      this.categories = categories;
    }
  }
};
</script>