Zugriff auf verschachtelte untergeordnete Komponenten in VueJS
Mit v2.2.2. Ich habe folgende Struktur in meinem VueJS app. Wie kann ich den Zugriff auf alle Konto-Komponenten aus einer Methode, die auf meinen Beitrag Komponente? Die Anzahl der Konten ist dynamisch - das will ich greifen alle geladen Account
Komponenten und Durchlaufen Sie diese.
Ich weiß, es hat etwas zu tun mit $refs
und $children
, ich kann einfach nicht scheinen, um herauszufinden, den richtigen Weg.
<Root>
<Post>
<AccountSelector>
<Account ref="anAccount"></Account>
<Account ref="anAccount"></Account>
<Account ref="anAccount"></Account>
</AccountSelector>
</Post>
</Root>
Du musst angemeldet sein, um einen Kommentar abzugeben.
http://vuejs.org/v2/guide/components.html#Child-Component-Refs
Grundsätzlich innerhalb
AccountSelector.vue
Sie tun könnenthis.$refs.anAccount.map(account => doThingToAccount(account))
Bearbeiten
Die obige Antwort ist für den Zugriff auf ein direktes Kind.
Derzeit gibt es keine Möglichkeit, den Zugriff auf eine nicht direkte Eltern - /Kind-Komponente mit
$refs
. Der beste Weg, um Zugriff auf Ihre Daten durch Veranstaltungen http://vuejs.org/v2/guide/components.html#Non-Parent-Child-Communication oder mit Vuex (Was ich empfehlen würde).Nicht die direkten Eltern - Kind-Kommunikation ist sehr schwierig, ohne 1 dieser 2 Methoden.
Post
? Ich bin auf der Suche, um Zugriff auf die Daten innerhalb der Post, eine Stufe über AccountSelector. Wenn ichpost.$refs.anAccount
bekomme ich undefined. Mir fehlt ein level.Können Sie Zugriff auf geschachtelte Komponenten-Daten mit $refs und, wenn Sie wollen, um den Zugriff auf die refs innerhalb von es Sie zunächst zum Ziel das erste element des ersten refs ([0])
Beispiel:
parent.$refs[0].$refs.anAccount