JavaScript တွင် Component အတွင်းသို့ ဒေတာများပို့ခြင်း

မိဘ component မှ child component အတွင်းသို့ ဒေတာများပို့နိုင်သည်။ ထိုသို့ပြုလုပ်ရန် component ၏ tag တွင် ဒေတာများပါသော attributes များရေးရမည်။ ဥပမာအားဖြင့်၊ user ၏ အမည်နှင့် သူ၏မိသားစုအမည်ကို ပို့ကြည့်ကြမည်-

App.vue<template>
  <User name="john" surn="smit" />
</template>

ထိုသို့ပို့သော ဒေတာများကို props ဟုခေါ်သည်။ ထို component သည် ထိုဒေတာများကို လက်ခံရရှိရန်၊ props ဆက်တင်တွင် ၎င်းတို့၏ အမည်များကို စာရင်းပြုစုပေးရမည်-

components/User.vue<script>
  export default {
    props: ['name', 'surn'],
    data() {
      return {
        
      }
    }
  }
</script>

ယခုပို့လိုက်သော ဒေတာများကို child component ၏ template ထဲတွင် ထုတ်ပြနိုင်သည်-

components/User.vue<template>
  {{ name }}
  {{ surn }}
</template>