Vueにおける配列

Vueにおける配列の内容の表示は、純粋なJavaScriptの場合と同じように行われます。その方法を見てみましょう。 dataに、内部に何らかの配列を含むプロパティarrがあるとします：

data() {
	return {
		arr: [1, 2, 3],
	}
}

この配列の要素を表示してみましょう：

<template>
	{{ arr[0] }}
	{{ arr[1] }}
	{{ arr[2] }}
</template>

dataに次の配列が保存されているとします：

data() {
	return {
		arr: ['x', 'y', 'z'],
	}
}

この配列の各要素を個別の段落に表示してください。

dataに次の配列が保存されているとします：

data() {
	return {
		arr: [1, 2, 3],
	}
}

この配列の要素の合計を画面に表示してください。