Getting keys when iterating over arrays in Vue
Sometimes, in addition to the array elements, we would like to access the keys as well. For this, the following extended syntax is used:
<template>
<p v-for="(elem, key) in arr">
{{ key }} {{ elem }}
</p>
</template>
You can do various operations with keys when outputting. For example, let's make the numbers start with one:
<template>
<p v-for="(elem, key) in arr">
{{ key + 1 }} {{ elem }}
</p>
</template>
The following array is given:
data() {
return {
arr: ['x', 'y', 'z'],
}
}
Print the keys of this array as a list ul.
