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 리스트 형태로 출력하세요.