Pętle w Vue.js z użyciem dyrektywy v-for

[type-of-web-komentarze[bot]]

Pętle w Vue.js z użyciem dyrektywy v-for

Pisząc aplikacje w Vue.js bardzo często będziesz chciał(a) wyświetlić listę elementów w pętli na podstawie tablicy. Właśnie w tym celu "język szablonów" wbudowany w Vue.js udostępnia dyrektywę v-for. W najprostszej postaci odpowiada ona pętli for znanej z JavaScriptu.

https://typeofweb.com/petle-w-vue-js-z-uzyciem-dyrektywy-v-for

[type-of-web-komentarze[bot]]

Gravatar	Imię	Adres	Data
	Mateusz Stepaniuk		2019-01-04 11:27

Bardzo fajna seria postów o Vue, ale przy tym brakuje mi zaznaczenia kilku detali. Mam na myśli wspomniany przez @tomasz_sochacki:disqus key oraz nieużywanie v-if a jednym elemencie z v-for co jest bardzo częstym błędem.

 
 

Komentarz zaimportowany z WordPressa

[type-of-web-komentarze[bot]]

Gravatar	Imię	Adres	Data
	wojtiku		2019-09-19 17:54

Bardzo dobra uwaga jeśli chodzi o atrybut key. Na ten moment pominąłem go świadomie. Kurs staram się pisać "od podstaw" i ten temat pojawi się później.

Jeśli chodzi o v-for z v-if. Kiedyś był to błąd, a obecnie priorytet jest jasno ustalony. Gdy oba występują na elemencie, to v-if dotyczy pojedynczej iteracji. Postaram się dziś uzupełnić wpis o tę informację bo to bardzo dobra uwaga. Dzięki!

 
 

Komentarz zaimportowany z WordPressa

[type-of-web-komentarze[bot]]

Gravatar	Imię	Adres	Data
	Sylwia Fait		2019-01-04 11:27

Rozwiązanie ćwiczenia: https://codepen.io/sfait/pen/PBPRVg

 
 

Komentarz zaimportowany z WordPressa

[type-of-web-komentarze[bot]]

Gravatar	Imię	Adres	Data
	Tomasz Sochacki	http://poradnik.drogimex.pl	2019-01-04 11:27

Duży plusik za fajne serie o frameworkach front-endowych. Aktualnie co prawda pracuję głównie w Angular ale śledzę sobie na bieżąco Twoje wpisy o React i teraz Vue. Zrodziło mi się tylko po dzisiejszym poście takie pytanko czy w Vue występuje coś na wzór key w React czy trackBy w Angular ?

 
 

Komentarz zaimportowany z WordPressa

[type-of-web-komentarze[bot]]

Gravatar	Imię	Adres	Data
	Mateusz Stepaniuk		2019-09-19 17:54

Tak, występuje. https://vuejs.org/v2/style-guide/#Keyed-v-for-essential

 
 

Komentarz zaimportowany z WordPressa