Vue-də massivlərin üzərinə gəzmək

Vue teqlərin dövrdə yaradılmasına imkan verir. Bu, xüsusi v-for direktivi ilə edilir. Gəlin görək, o massivlər üçün necə işləyir. Bunun üçün aşağıdakı massivi yaradaq:

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

Gəlin bu massivin hər bir elementini ayrıca abzasda çıxaraq. Bunun üçün təmsildə əvvəlcə bir abzas yaradaq:

App.vue<template>
  <p></p>
</template>

İndi abzasımıza v-for direktivini yazaq. Bu direktivin dəyəri kimi üzərinə gəziləcək massivin adını və bu massivin elementlərinin ardıcıl olaraq düşəcəyi dəyişəni göstərmək lazımdır. Bizim halda massivin adı arr olacaq, dəyişən üçün isə elem adını tapşırırıq:

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

Nəticədə bizim abzas massivdəki element sayı qədər təkrarlanacaq. Gəlin üzərinə gəzilən elementləri abzalarımızın mətnində çıxaraq:

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

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

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

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