ปฏิกิริยาของอาร์เรย์ใน 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">add</button>
</template>

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

Задание 1

มีปุ่ม ให้ อาร์เรย์ แสดงผลองค์ประกอบ ของอาร์เรย์นี้ในรูปแบบรายการ ul ทำให้ เมื่อกดปุ่ม จะมีรายการใหม่ เพิ่มที่ท้ายรายการนี้

Задание 2

มีปุ่ม ให้ อาร์เรย์ แสดงผลองค์ประกอบ ของอาร์เรย์นี้ในรูปแบบรายการ ul ทำให้ ทุกครั้งที่กดปุ่ม รายการแรกของรายการถูกลบออก

Задание 3

มีปุ่ม ให้ อาร์เรย์ แสดงผลองค์ประกอบ ของอาร์เรย์นี้ในรูปแบบรายการ ul ทำให้ ทุกครั้งที่กดปุ่ม รายการสุดท้ายของรายการถูกลบออก

Задание 4

มีปุ่ม ให้ อาร์เรย์ แสดงผลองค์ประกอบ ของอาร์เรย์นี้ในรูปแบบรายการ ul ทำให้ ทุกครั้งที่กดปุ่ม รายการรองสุดท้ายของรายการถูกลบออก

Задание 5

มีปุ่ม ให้ อาร์เรย์ แสดงผลองค์ประกอบ ของอาร์เรย์นี้ในรูปแบบรายการ ul ทำให้ เมื่อกดปุ่ม รายการในรายการเรียงลำดับ

Задание 6

มีปุ่ม ให้ อาร์เรย์ แสดงผลองค์ประกอบ ของอาร์เรย์นี้ในรูปแบบรายการ ul ทำให้ เมื่อกดปุ่ม รายการในรายการเรียงลำดับ ในลำดับย้อนกลับ