Vue komponentiniň gurluşy

Her bir komponent aşakdaky iki tegdän ybarat bolmaly:

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

template teginde biz komponentiň görnüşini, ýagny sahypanyň html gurluşyny ýazýarys:

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

script teginde bolsa komponentiň JavaScript kodyny ýazýarys. Bu kod komponent faýlymyzdan eksport edilýän obyekti görkezmeli:

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

Eksport edilýän obýektde komponentiň dürli sazlamalary we funksiýalary görkezilýär. Bu sazlamalaryň biri şol komponentiň ady:

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