Obținerea cheilor la iterarea prin array-uri în Vue

Uneori, pe lângă elementele array-ului, am dori să avem acces și la chei. Pentru aceasta se folosește următoarea sintaxă extinsă:

App.vue<template>
  <p v-for="(elem, key) in arr">
     {{ key }} {{ elem }}
  </p>
</template>

Cu cheile la afișare se pot face diverse operații. De exemplu, să facem ca numerele să înceapă de la unu:

App.vue<template>
  <p v-for="(elem, key) in arr">
     {{ key + 1 }} {{ elem }}
  </p>
</template>

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