โครงสร้างคอมโพเนนต์ Vue
คอมโพเนนต์ทุกตัวควรประกอบด้วย แท็กทั้งสองต่อไปนี้:
<script>
</script>
<template>
</template>
ในแท็ก template ควรเขียน
มาร์กอัป นั่นคือ ส่วนแสดงผล
ของคอมโพเนนต์ของเรา:
<template>
<div>
Hello World
</div>
</template>
และในแท็ก script ควร
เขียนโค้ด JavaScript ของคอมโพเนนต์ของเรา
โค้ดนี้ควรเป็น
วัตถุที่จะถูกส่งออก
จากไฟล์คอมโพเนนต์ของเรา:
<script>
export default {
}
</script>
ในการส่งออบเจ็กต์ออก จะระบุ การตั้งค่าและฟังก์ชันต่างๆ ของคอมโพเนนต์ หนึ่งในการตั้งค่านั้นคือชื่อ ของคอมโพเนนต์นี้:
export default {
name: 'App',
}
ในแท็ก template ของคอมโพเนนต์ของคุณ
ให้แสดงข้อความบางข้อความพร้อมแท็ก