Vue.js przekazywanie rekwizytów do danych

Question

Mam 2 komponenty: Post i Comments.

Wewnątrz komponentu Post, istnieje komponent Komentarze, który ma 3 podpórki: postId, numCom (liczba komentarzy) i comments (tablica).

uzyskać komentarze i przekazać tablicę z rekwizytami, a teraz chcę odzyskać tablicę w komentarzach komponentu i dodać go do danych, więc można następnie dodawać/usuwać komentarze itd

Tu jest mój kod w Comments.vue:

props: ['id', 'numCom', 'comments'], 
data: function() { 
    return { 
    newMessage: "", 
    loading: false, 
    allComments: this.comments, 
    num: this.numCom, 
    } 
}, 

Ale to nie działa. W narzędziach programistycznych Vue widzę, że podpora comments jest wypełniona komentarzami, ale tablica allComments jest pusta.

Co należy zrobić?

Answer 1

Wygląda na to, że podpora comments nie ma wartości w momencie jej utworzenia (jest to jedyny czas ustawiony na allComments).

Można:

1. Defer utworzenie komponentu do comments rekwizytem jest gotowy za pomocą v-if tak:

<comments v-if="comments" :comments="comments"></comments> 

2. Obserwuj zmiany w podpunkcie comments i ustaw allComments na nową wartość (oprócz inicjowania allComments w funkcji danych):

watch: { 
    comments(value) { 
    this.allComments = value; 
    } 
}