Pogoji v zankah v Vue
Pri ponavljanju elementov z zankami
je mogoče uporabiti pogoje.
Toda direktivi v-for in v-if
je treba napisati na različnih oznakah,
drugače pride do konflikta. Da bi se izognili
konfliktu, uporabimo direktivo v-for
na oznaki template,
directivo v-if pa neposredno
na vstavljeno oznako.
Poglejmo si primer. Recimo, da imamo naslednje polje:
data() {
return {
arr: [1, 2, 3, 4, 5],
}
}
Ponovimo to polje z zanko:
<template>
<ul>
<li v-for="elem in arr">
{{ elem }}
</li>
</ul>
</template>
In zdaj naložimo pogoj na prikazane elemente:
<template>
<ul>
<template v-for="elem in arr">
<li v-if="elem % 2 === 0">
{{ elem }}
</li>
</template>
</ul>
</template>
Podano je naslednje polje:
data() {
return {
items: [1, -2, 3, -4, 5],
}
}
Ponovite to polje z zanko in izpišite samo pozitivne elemente polja.
