Vueにおける配列の反復処理でのキーの取得
時には、配列の要素に加えてキーにもアクセスしたい場合があります。そのためには、次の拡張構文を使用します:
<template>
<p v-for="(elem, key) in arr">
{{ key }} {{ elem }}
</p>
</template>
出力時にキーに対して様々な操作を行うことができます。例えば、番号を1から始まるようにしましょう:
<template>
<p v-for="(elem, key) in arr">
{{ key + 1 }} {{ elem }}
</p>
</template>
次の配列が与えられています:
data() {
return {
arr: ['x', 'y', 'z'],
}
}
この配列のキーをulリストとして表示してください。