[Vuejs]-Vuex sync : Cannot read property of undefined

by

0👍

In component, you can check if getMeals returns a non-empty array, then render the v-for loop:

<template>
<v-container v-if="getMeals().length > 0">

    <v-card v-for="(order,i) in getOrders" :key="i" class="cart-cards text-left">

            <v-card-title>
                {{getMealById(order.meal_id).name}}
            </v-card-title>

    </v-card>

</v-container>
</template>

<script>
import { mapGetters, mapActions } from "vuex";

export default {
    data: () => ({
    }),
    created() {
        this.fetchOrders();
    },
    mounted() {
    },
    methods: {
        ...mapActions(["fetchOrders"]),
    },
    computed: {
        ...mapGetters(["getMeals", "getOrders", "getMealById"]),
    },
};

Leave a comment