...is not a function

Odpowiedz Nowy wątek
2019-06-23 08:32
0

Piszę apkę, w której pobieram dane z api i wyświetlam je, używam do tego vuex, na stronie wyświetlam pasek wyszukiwania z metodą:

<div class="panel panel-default">
        <input
                class="form-control"
                type="text"
                placeholder="Search"
                aria-label="Search"
                v-model="filterText">
        <div class="panel-body records"
             v-for="record in filterData"
             >
            <p>{{record.name}}</p>
            <img :src="record.img" alt="">
        </div>
    </div>

<script>
    import { mapGetters } from 'vuex'
    export default {
        data() {
            return {
                job: '',
                artistData: '',
                img: '',
                filterText: '',
            }
        },
        created() {
          this.$store.dispatch('fetchAlbums');       // pobieranie z api, commit na zapis do state
        },
        computed: {
            ...mapGetters([
                'getData',
            ]),
            filterData() {
                return this.getData.filter((element) => {
                    return (element.name.match(this.filterText));
                });
            }
        },
    }
</script>

Na początku wszystko działało jak należy, potem w konsoli logował się błąd:

[Vue warn]: Error in render: "TypeError: this.getData.filter is not a function"

Już sam nie wiem co mam z tym zrobić, bo działa jak chce :D

Pozostało 580 znaków

2019-06-23 10:06
0

A nie powinno być przypadkiem getData().filter?

Pozostało 580 znaków

2019-06-23 10:09
0
anonimowy napisał(a):

A nie powinno być przypadkiem getData().filter?

Sprawdzałem, nadal to samo

Pozostało 580 znaków

2019-06-23 10:25
0

Za pierwszym razem działa, po odświeżeniu wywala błąd

Pozostało 580 znaków

2019-06-23 10:45
0
anonimowy napisał(a):

A nie powinno być przypadkiem getData().filter?

Nie powinno, bo getData to computed property.


Pozostało 580 znaków

2019-06-23 10:46
1
Nindzia napisał(a):

Na początku wszystko działało jak należy, potem w konsoli logował się błąd:

[Vue warn]: Error in render: "TypeError: this.getData.filter is not a function"

Już sam nie wiem co mam z tym zrobić, bo działa jak chce :D

Jesteś pewien że getter getData zwraca array zawsze? Dopisz sobie w kodzie słówko debugger; (jeśli umiesz korzystać z debuggera) lub po prostu wstaw console.log(this.getData) i upewnij się że to jest array.


edytowany 1x, ostatnio: TomRiddle, 2019-06-23 10:46

Pozostało 580 znaków

2019-06-23 11:09
0
TomRiddle napisał(a):
Nindzia napisał(a):

Na początku wszystko działało jak należy, potem w konsoli logował się błąd:

[Vue warn]: Error in render: "TypeError: this.getData.filter is not a function"

Już sam nie wiem co mam z tym zrobić, bo działa jak chce :D

Jesteś pewien że getter getData zwraca array zawsze? Dopisz sobie w kodzie słówko debugger; (jeśli umiesz korzystać z debuggera) lub po prostu wstaw console.log(this.getData) i upewnij się że to jest array.

Tak, to tablica obiektów

Pozostało 580 znaków

2019-06-23 11:42
0
Nindzia napisał(a):

Tak, to tablica obiektów

W obu przypadkach? Bo wiesz, tablice mają funkcję filter(), więc to co się znajduję pod this.getData raczej nie może być arrayem, skoro dostajesz this.getData.filter is not a function.


Pozostało 580 znaków

2019-06-23 12:36
0
TomRiddle napisał(a):
Nindzia napisał(a):

Tak, to tablica obiektów

W obu przypadkach? Bo wiesz, tablice mają funkcję filter(), więc to co się znajduję pod this.getData raczej nie może być arrayem, skoro dostajesz this.getData.filter is not a function.

Sprawdzę jeszcze raz jak będę w domu

Pozostało 580 znaków

2019-06-24 02:10
0

Jeżeli getData okaże się tablicą (ale dlaczego miałoby mieć nazwę jak funkcja?), możesz jeszcze zobaczyć, czy this jest odpowiednie. Nie używałem Vue, ale wiem tyle, że this może mieć najróżniejsze wartości w zależności od kilku kryteriów.


Pozostało 580 znaków

2019-06-24 09:55
0
Silv napisał(a):

Jeżeli getData okaże się tablicą (ale dlaczego miałoby mieć nazwę jak funkcja?)

Bo to jest funkcja - funkcja która zwraca tablicę.


Wywoływana jakoś przez Vue, jak rozumiem? - Silv 2019-06-24 16:20
@Silv: nie, przez programistę. - TomRiddle 2019-06-24 16:21
No, to w powyższym kodzie nie widzę tego wywołania. - Silv 2019-06-24 16:35

Pozostało 580 znaków

Odpowiedz
Liczba odpowiedzi na stronę

1 użytkowników online, w tym zalogowanych: 0, gości: 1, botów: 0