[Vue warn]: Error in callback for watcher "childItems": "TypeError: Cannot read property 'tag' of undefined"

I am currently working on the Store page of a webapp I am building using Axios to fetch product data and then display it in a vue template. All the backend works and the front end renders successfully as well, however Vue gives a Warning twice in the console stating: Error in callback for watcher "childItems": "TypeError: Cannot read property 'tag' of undefined"

To combat this, I have tried wrapping the v-for for iterating products in a v-if that is set to true by the async getProducts function which sends a get request for the product data to display. I have tried moving around where the getter function is, placing it in Mounted, beforeMount, created, used vue-async-computed and all have rendered fine but none have gotten rid of the error.

Here is my store.vue file:

<template>
    <div id="store">
        <section>
            <b-tabs>
                <div class="container">
                    <div v-if="fetchComplete">
                        <b-tab-item v-for="(product, index) in products" :label="product.categories[0].title" :key="index">
                        <div class="card">
                            <div class="card-image">
                                <figure class="image">
                                    <img :src="'http://localhost:1339'+ product.product_color_imgs[0].img[0].url" :alt="product.title">
                                </figure>
                            </div>
                            <div class="card-content">
                                <p class="title is-4">{{product.title}}</p>
                            </div>
                        </div>
                    </b-tab-item>
                    </div>
                </div>
            </b-tabs>
        </section>
    </div>
</template>
<script>
import axios from 'axios';

export default {
    data() {
        return {
            products: [],
            fetchComplete: false
        }
    },
    async beforeCreate() {
        await axios({
                method:'get',
                url:'http://localhost:1339/products'
            }).then(res => {
                this.products = res.data;
                this.fetchComplete = true;
            }).catch(err => {
                console.log(err);
            })  
        }
}
</script>

In this version I used beforeCreate but I have tested it with the other life-cycle functions. My guess is that the promise from beforeCreate returns after the page has rendered the first time.

Note: I am relatively new to Vue.js so it is possible I may have overlooked something

Thank you in advance!