Object.entries() 方法返回一个给定对象自身可枚举属性的键值对数组。

有以下需求：

let cpuData = reactive([{ label: '总量', content: 'test' },{ label: '已使用', content: 'test' },{ label: '未使用', content: 'test' }
])<el-form label-position="left" label-width="auto" class="center"><el-form-item v-for="item in cpuData" :key="item.content" :label="item.label">{{item.content}}</el-form-item>
</el-form>

效果如下：

但是content的数据是从后端传来的（即图中的test），写成以上的数据结构后端不好传值，

只能cpuData[0].content='XXX'，cpuData[1].content='XXXX'，这样语义性不好，后面不好维护

改进方法---------------------------------------------------------------------------------------------------------------

let memoryData =reactive( {'Num':{label: '总量', content: 'test'},'Use':{label: '已使用', content: 'test'},'unUse':{label: '未使用', content: 'test'}
})<el-form label-position="left" label-width="auto" class="center"><el-form-item v-for="item in Object.entries(memoryData)" :key="item[1].content" :label="item[1].label">{{item[1].content}}</el-form-item>
</el-form>

这样的话，既可以循环，赋值的时候语义性也更好，memoryData.Num.content='XXX'