การส่งข้อมูลเข้าไปในคอมโพเนนต์ใน JavaScript
จากคอมโพเนนต์แม่ สามารถ ส่งข้อมูลไปยังคอมโพเนนต์ลูกได้ สำหรับสิ่งนี้ ในแท็กของคอมโพเนนต์ ควรเขียนแอตทริบิวต์พร้อมข้อมูล ตัวอย่างเช่น ลองส่ง ชื่อและนามสกุลของผู้ใช้:
<template>
<User name="john" surn="smit" />
</template>
ข้อมูลที่ส่งผ่านมาเช่นนี้เรียกว่า
พร็อปส์ เพื่อให้
คอมโพเนนต์ได้รับข้อมูลเหล่านี้
จำเป็นต้องระบุชื่อของข้อมูลเหล่านั้น
ในการตั้งค่า props:
<script>
export default {
props: ['name', 'surn'],
data() {
return {
}
}
}
</script>
ตอนนี้ข้อมูลที่ส่งผ่านมาสามารถ แสดงผลในเทมเพลตของคอมโพเนนต์ลูก:
<template>
{{ name }}
{{ surn }}
</template>
ส่งไปยังคอมโพเนนต์ Employee
ชื่อ นามสกุล และอายุของพนักงาน
ภายในคอมโพเนนต์ Employee
ให้แสดงผลพร็อปส์แต่ละตัว
ในแท็กแยกกัน
