Vue-da massiwleri geçmek

Vue tegleri aýlawda döretmäge rugsat berýär. Bu ýörite v-for direktiwasy arkaly edilýär. Geliň, onuň massiwler üçin nähili işleýändigine göz aýlap geçeliň. Bunun üçin aşakdaky massiw ýasaýarys:

data() {
	return {
		arr: ['a', 'b', 'c'],
	}
}

Geliň bu massiwdaky her bir element aýratyn abzasda görkezeliň. Bunun üçin görkezişde ilki bir abzas ýasaýarys:

<template>
	<p></p>
</template>

Indi abzamyza v-for direktiwasyny ýazaýarys. Bu direktiwanyň gymmaty hökmünde geçilýän massiwüň adyny we onda yzygiderli birikdirilerýän üýtgeýän adyny görkezmek gerek. Bizim ýagdaýymyzda massiwüň ady arr, üýtgeýän ady üçin bolsa elem atyny oýlap tabarys:

<template>
	<p v-for="elem in arr"></p>
</template>

Netijede, bizim abzasymyz massiwde näçe element bar bolsa şonça gezek gaýtalanar. Geliň geçilýän elementleri abzalarymyzyň tekstinde görkezeliň:

<template>
	<p v-for="elem in arr">{{ elem }}</p>
</template>

data içinde aşakdaky massiw saklansyn:

data() {
	return {
		items: [1, 2, 3, 4, 5],
	}
}

Bu massiwüň her bir elementini öz div teginde görkeziň.

Aşakdaky massiw berlen:

data() {
	return {
		items: [1, 2, 3, 4, 5],
	}
}

Bu massiwüň her bir elementiniň kwadratyny öz div teginde görkeziň.

Aşakdaky massiw berlen:

data() {
	return {
		items: [1, 2, 3, 4, 5],
	}
}

Bu massiwüň elementlerini ul sanawy görnüşinde görkeziň.