Vueにおけるdataオブジェクト

コンポーネントの基礎は、私たちが操作するデータです。これらのデータは、特別なオブジェクト data に保存されます。このオブジェクトは、特別なメソッドの結果として返される必要があります:

export default {
	data() {
		return {
			
		}
	}
}

データオブジェクトのプロパティに何らかのテキストを保存してみましょう:

data() {
	return {
		text1: '111',
		text2: '222',
	}
}

保存したデータは、テンプレート（ビュー）に出力することができます。これは二重中括弧の中で行われ、出力したいプロパティの名前を記述します。私たちのプロパティの値を出力してみましょう:

<template>
	{{ text1 }}
	{{ text2 }}
</template>

次に、それぞれのメッセージが独自の段落タグで出力されるようにしましょう:

<template>
	<p>{{ text1 }}</p>
	<p>{{ text2 }}</p>
</template>

data にユーザーの名前と姓を保存するとします:

data() {
	return {
		name: 'john',
		surn: 'smit',
	}
}

各プロパティを別々の div タグ内に出力してください。