Vueコンポーネントの構造
各コンポーネントは、以下の2つのタグで構成される必要があります:
<script>
</script>
<template>
</template>
templateタグ内には、コンポーネントのビュー、
つまりレイアウトを記述します:
<template>
<div>
Hello World
</div>
</template>
一方、scriptタグ内には、コンポーネントのJavaScriptコードを記述します。
このコードは、コンポーネントファイルからエクスポートされるオブジェクトである必要があります:
<script>
export default {
}
</script>
エクスポートされるオブジェクトには、コンポーネントの様々な設定や関数が指定されます。 設定の1つに、このコンポーネントの名前があります:
export default {
name: 'App',
}
コンポーネントのtemplateタグ内に、何かテキストをタグ付きで出力してください。