TypeError: this.cards.filter is not a function

i´ll do have a little problem with my Component displaying and filtering Data from my Database. Its returning a JSON Object and if this is getting to big im getting a "TypeError: this.cards.filter is not a function" error. In my testview its working but in the real database its crashing.

Code:

<div class="container sidebar-container">
            <ul class="nav justify-content-center nav-tabs">
                <li class="nav-item">
                    <a class="nav-link navbar" v-on:click.prevent="cardsFilterKey = 'all'" :class="{ active: cardsFilterKey == 'all'}">Alle</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link navbar" v-on:click.prevent="cardsFilterKey = 'livingspaces'" :class="{ active: cardsFilterKey == 'livingspaces'}">Wohnraum</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link navbar" v-on:click.prevent="cardsFilterKey = 'therapies'" :class="{ active: cardsFilterKey == 'therapies'}">Therapien</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link navbar" v-on:click.prevent="cardsFilterKey = 'news'" :class="{ active: cardsFilterKey == 'news'}">News</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link navbar" v-on:click.prevent="cardsFilterKey = 'achievements'" :class="{ active: cardsFilterKey == 'achievements'}">Erfolge</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link navbar" v-on:click.prevent="cardsFilterKey = 'events'" :class="{ active: cardsFilterKey == 'events'}">Events</a>
                </li>
            </ul>
            </div>

Displaying Data:

<div class="col-md-4" v-for="(card, index) in cardsFilter" style="padding-bottom:2em;">
                    <div class="card w-100 text-center card-div" style="width:18rem">
                    <img src="/img/card2.jpg" class="card-img-top">
                        <div class="card-body">
                            <h5 class="card-title"></h5>
                            <h6 class="card-subtitle mb-2 text-muted"></h6>
                            <p class="card-text"></p>
                            <button @click="showTextModal(index)" type="button" class="btn btn-primary">Zeige mehr Infos</button>
                        </div>
                    </div>
                    </div>

Filtering Data:

<script>
export default {
    data() {
        return {
            cards: [],
            validationErrors: '',
            uri: process.env.MIX_CARDS_URL,
            isHidden: true,
            cards_modal: [],
            cardsFilterKey: 'all'
        }
    },

    methods: {
        showTextModal(index) {
            $("#textModal").modal("show");
            this.cards_modal = this.cards[index];
        },
        loadCards() {
            axios.get(this.uri).then(response=>{
                this.cards = response.data.sortedData;
                this.loading=true;
            })
        }
    },

    computed: {
        cardsFilter() {
            return this[this.cardsFilterKey]
        },
        all(){
            return this.cards
        },
        news() {
            return this.cards.filter((card) => card.category == 'news')
        },
        achievements() {
            return this.cards.filter((card) => card.category == 'achievements')
        },
        events() {
            return this.cards.filter((card) => card.category == 'events')
        },
        livingspaces() {
            return this.cards.filter((card) => card.category == 'livingspaces')
        },
        therapies() {
            return this.cards.filter((card) => card.category == 'therapies')
        }
    },

    mounted() {
        this.loadCards();
    }
}
</script>

Some ideas why this is happening only on the live-server not on my localhost:8000? Same configuration same files same database just other data inside the database

from Newest questions tagged laravel-5 - Stack Overflow http://bit.ly/2B84MEU
via IFTTT