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 सूची के रूप में प्रदर्शित करें। ऐसा करें कि बटन दबाने पर सूची के आइटम्स उल्टे क्रम में व्यवस्थित हो जाएं।