Vue-ში მასივების რეაქტიულობა

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

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

App.vue<template>
  <p v-for="elem in arr">
    {{ elem }}
  </p>
  <button @click="add">დამატება</button>
</template>

App.vuemethods: {
  add: function() {
    this.arr.push('xxx');
  }
}

Задание 1

მოცემულია ღილაკი. მოცემულია მასივი. გამოიტანეთ ელემენტები ამ მასივის სიის ul სახით. გახადეთ ისე, რომ ღილაკზე დაჭერისას ამ სიის ბოლოს დაემატოს ახალი პუნქტი.

Задание 2

მოცემულია ღილაკი. მოცემულია მასივი. გამოიტანეთ ელემენტები ამ მასივის სიის ul სახით. გახადეთ ისე, რომ ყოველ ჯერზე, ღილაკზე დაჭერისას სიის პირველი პუნქტი წაიშალოს.

Задание 3

მოცემულია ღილაკი. მოცემულია მასივი. გამოიტანეთ ელემენტები ამ მასივის სიის ul სახით. გახადეთ ისე, რომ ყოველ ჯერზე, ღილაკზე დაჭერისას სიის ბოლო პუნქტი წაიშალოს.

Задание 4

მოცემულია ღილაკი. მოცემულია მასივი. გამოიტანეთ ელემენტები ამ მასივის სიის ul სახით. გახადეთ ისე, რომ ყოველ ჯერზე, ღილაკზე დაჭერისას სიის ბოლოდან მეორე პუნქტი წაიშალოს.

Задание 5

მოცემულია ღილაკი. მოცემულია მასივი. გამოიტანეთ ელემენტები ამ მასივის სიის ul სახით. გახადეთ ისე, რომ ღილაკზე დაჭერისას სიის პუნქტები დალაგდეს.

Задание 6

მოცემულია ღილაკი. მოცემულია მასივი. გამოიტანეთ ელემენტები ამ მასივის სიის ul სახით. გახადეთ ისე, რომ ღილაკზე დაჭერისას სიის პუნქტები უკუღმა დალაგდეს.