Vue တွင် Array များ၏ Reactivity

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

ခလုတ်တစ်ခုကို ပေးထားသည်။ Array တစ်ခုကို ပေးထားသည်။ ဤ array ၏ အရာဝတ္ထုများကို စာရင်း ul အဖြစ်ဖြင့် ဖော်ပြပါ။ ခလုတ်ကို နှိပ်လိုက်သည့်အခါ ဤစာရင်း၏ နောက်ဆုံးတွင် အချက်အလက်အသစ်တစ်ခု ထည့်သွင်းပေးမည့် နည်းလမ်းကို လုပ်ဆောင်ပါ။

Задание 2

ခလုတ်တစ်ခုကို ပေးထားသည်။ Array တစ်ခုကို ပေးထားသည်။ ဤ array ၏ အရာဝတ္ထုများကို စာရင်း ul အဖြစ်ဖြင့် ဖော်ပြပါ။ ခလုတ်ကို နှိပ်လိုက်သည့်အခါတိုင်း စာရင်းမှ ပထမဆုံးအချက်အလက်ကို ဖယ်ရှားပေးမည့် နည်းလမ်းကို လုပ်ဆောင်ပါ။

Задание 3

ခလုတ်တစ်ခုကို ပေးထားသည်။ Array တစ်ခုကို ပေးထားသည်။ ဤ array ၏ အရာဝတ္ထုများကို စာရင်း ul အဖြစ်ဖြင့် ဖော်ပြပါ။ ခလုတ်ကို နှိပ်လိုက်သည့်အခါတိုင်း စာရင်းမှ နောက်ဆုံးအချက်အလက်ကို ဖယ်ရှားပေးမည့် နည်းလမ်းကို လုပ်ဆောင်ပါ။

Задание 4

ခလုတ်တစ်ခုကို ပေးထားသည်။ Array တစ်ခုကို ပေးထားသည်။ ဤ array ၏ အရာဝတ္ထုများကို စာရင်း ul အဖြစ်ဖြင့် ဖော်ပြပါ။ ခလုတ်ကို နှိပ်လိုက်သည့်အခါတိုင်း စာရင်းမှ ဒုတိယမြောက် နောက်ဆုံးအချက်အလက်ကို ဖယ်ရှားပေးမည့် နည်းလမ်းကို လုပ်ဆောင်ပါ။

Задание 5

ခလုတ်တစ်ခုကို ပေးထားသည်။ Array တစ်ခုကို ပေးထားသည်။ ဤ array ၏ အရာဝတ္ထုများကို စာရင်း ul အဖြစ်ဖြင့် ဖော်ပြပါ။ ခလုတ်ကို နှိပ်လိုက်သည့်အခါ စာရင်းရှိ အချက်အလက်များကို အစဉ်လိုက် စီပေးမည့် နည်းလမ်းကို လုပ်ဆောင်ပါ။

Задание 6

ခလုတ်တစ်ခုကို ပေးထားသည်။ Array တစ်ခုကို ပေးထားသည်။ ဤ array ၏ အရာဝတ္ထုများကို စာရင်း ul အဖြစ်ဖြင့် ဖော်ပြပါ။ ခလုတ်ကို နှိပ်လိုက်သည့်အခါ စာရင်းရှိ အချက်အလက်များကို ပြောင်းပြန်အစဉ်အတိုင်း စီပေးမည့် နည်းလမ်းကို လုပ်ဆောင်ပါ။