这节课,我们来看下在 v-for
中的几种解构方式。
对数组进行解构
代码如下:
<template>
<div>
<ul>
<li v-for="(lang, index) in ['vue2', 'vue3', 'JavaScript', 'TypeScript']">
{
{ index }}: {
{ lang }}
</li>
</ul>
</div>
</template>
运行:
对对象进行解构
对对象进行解构时,我们可以获取对象的键值对。
<template>
<div>
<ul>
<li v-for="(value, key) in {
name: '王大冶',
age: 26,
job: '前端开发'
}">
{
{ key }}: {
{ value }}
</li>
</ul>
</div>
</template>