Obtendo chaves ao iterar arrays em Vue
Às vezes, além dos elementos do array, gostaríamos de ter acesso também às chaves. Para isso, é utilizada a seguinte sintaxe estendida:
<template>
<p v-for="(elem, key) in arr">
{{ key }} {{ elem }}
</p>
</template>
Podemos realizar várias operações com as chaves ao exibi-las. Por exemplo, vamos fazer com que os números comecem em um:
<template>
<p v-for="(elem, key) in arr">
{{ key + 1 }} {{ elem }}
</p>
</template>
Dado o seguinte array:
data() {
return {
arr: ['x', 'y', 'z'],
}
}
Exiba as chaves deste array
na forma de uma lista ul.