Struktur Komponen Vue

Setiap komponen mesti terdiri daripada dua tag berikut:

App.vue<script>
  
</script>
<template>
  
</template>

Dalam tag template, tuliskan markup, iaitu persembahan komponen kami:

App.vue<template>
  <div>
    Hello World
  </div>
</template>

Dan dalam tag script, tuliskan kod JavaScript untuk komponen kami. Kod ini hendaklah berupa objek yang akan dieksport dari fail komponen kami:

App.vue<script>
  export default {
    
  }
</script>

Dalam objek yang dieksport, ditentukan pelbagai tetapan dan fungsi komponen. Salah satu tetapan ialah nama komponen ini:

App.vueexport default {
  name: 'App',
}