vue obserwowanie komponentu

0

hej zacząłem właśnie zabawę z vue i napotkałem pewien problem.
Napisałem komponent w który pobiera dane ajaxem i wyświetla w formie tabelki. Teraz piszę kolejny komponent który agreguje kilka tabelek, wygląda to mniej więcej tak:

<span>Kontakty</span>
<table
            ref="contact"
            :api-url="contactsApiUrl"
            :columns="columns"
    ></table>
<span>Projekty</span>
<table
            ref="projects"
            :api-url="projectsApiUrl"
            :columns="columns"
    ></table>

Potrzebuje teraz przesyłać jakoś stan danych z komponentu table do mojego nadrzędnego komponentu jak żeby móc dodać klasę "active" do konkretnego spana w momencie gdzie zmienia się zawartość danych we właściwości apiData komponentu table. Nie do końca wie jak przesłać takie dane?
Próbowałem napisać metodę:

isContactActive() {
return this.$refs.contact.apiData.length > 0;
}

Ale contact jest wtedy undefined. Jak najlepiej przesłać te dane do nadrzędnego komponentu ?

0

Nie jest do końca jasne, co próbujesz zrobić, lecz takie kombinowanie przez $refs to w większości przypadków zła praktyka.

Kombinuj w taki sposób:

<template>
  <!-- ... -->
    <table is-updating="isUpdating"/>
  <!-- ... -->
</template>

<script>
export default {

  computed: {
    isUpdating() {
      return this.contact.apiData.length > 0;
    },
  },

};
</script>

Ew. jeśli musisz coś wprost z table wysłać wyżej (co nie powinno się zdarzać często, ponieważ wprowadza tight coupling), powinieneś to robić przez zdarzenia ($emit itd. - są przykłady w dokumentacji Vue).

Btw, nie nazywaj własnych komponentów w sposób kolidujący z normalnymi HTMLowymi elementami - pisz raczej v-table, x-table czy cokolwiek w ten deseń.

0

@Patryk27: Generalnie chodzi o to, żeby w komponencie A który agreguje kilka komponentów tabel - sprawdzać czy konkretna tabela zawiera jakieś dane - jeśli tak to dodawać odpowiednią klasę do spana

0

W takim razie możesz bez problemu wrzucić to sprawdzanie do komponentu A (dokładnie tak jak w moim przykładzie).

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