Obtención de claves al iterar arrays en Vue
A veces, además de los elementos del array, nos gustaría tener acceso también a las claves. Para ello se utiliza la siguiente sintaxis extendida:
<template>
<p v-for="(elem, key) in arr">
{{ key }} {{ elem }}
</p>
</template>
Con las claves en la salida se pueden hacer varias operaciones. Por ejemplo, hagamos que los números comiencen desde uno:
<template>
<p v-for="(elem, key) in arr">
{{ key + 1 }} {{ elem }}
</p>
</template>
Se da el siguiente array:
data() {
return {
arr: ['x', 'y', 'z'],
}
}
Muestre las claves de este array
en forma de lista ul.