Vue में ऐरे इटरेशन के दौरान कुंजियाँ प्राप्त करना

कभी-कभी ऐरे तत्वों के अलावा, हम कुंजियों तक भी पहुंच प्राप्त करना चाहते हैं। इसके लिए निम्नलिखित विस्तारित सिंटैक्स का उपयोग किया जाता है:

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

आउटपुट में कुंजियों के साथ विभिन्न ऑपरेशन किए जा सकते हैं। उदाहरण के लिए, आइए ऐसा करें कि नंबर एक से शुरू हों:

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

निम्नलिखित ऐरे दिया गया है:

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

इस ऐरे की कुंजियों को ul सूची के रूप में प्रदर्शित करें।