使用json对象转化为key,value的对象数组
更新时间:2022年6月17日 15:03 点击:1407 作者:阿仁_清风徐来
json对象转为key,value对象数组
问题引出
在某个从后端获取的表格数据中,有一列是对象格式,不能用于直接展示。
解决方式
不直接展示此列,在操作列加一个按钮,点击之后弹窗展示那一列的数据,形式为key和value的两列表格,key为该对象的各个字段名,value为字段值。这就需要将对象转化为key和value形式的对象数组。
代码
const metaData = {"api-type": "apiparser", "management.port": "8101"} Object.entries(metaData).map(([key, value]) => ({ key, value }))
效果
key,value的对象数组转化为json对象
arr.reduce((acc, curr) => { acc[curr.key] = curr.value return acc }, {})
函数式
/** * 传入对象得到 key、value 形式的对象数组 * key、value可以自定义 * @param {Object} MAP 要处理的对象 * @param {String} key 对象的key * @param {String} value 对象的value * @returns 数组 */ export function mapToJson(MAP, key, value) { return Object.keys(MAP).map(item => ({ [key]: item, [value]: MAP[item], })) }
数组转换成json key-value形式
eg1(数组中包含的是数组)
var jsonData = {}; var arr = [[1, 'boy', 'dabing'], [2, 'girl', 'dabing']]; for (var i = 0; i < arr.length; i++) { var key = arr[i][1]; var value = arr[i][2]; jsonData[key] = value; } console.log(jsonData['boy'])// 'dabing'
eg2(数组中包含的是对象)
var jsonData = {}; var arr = [ { id: 3, name: 'MAN_MIDDLESCHOOL_STUDENT', value: 'predefine' }, { id: 4, name: 'FEMALE_MIDDLESCHOOL_STUDENT', value: 'predefine' }]; for (var i = 0; i < arr.length; i++) { var key = arr[i].name; var value = arr[i].value; jsonData[key] = value; } console.log(jsonData);//{ MAN_MIDDLESCHOOL_STUDENT: 'predefine', FEMALE_MIDDLESCHOOL_STUDENT: 'predefine' }
以上为个人经验,希望能给大家一个参考,也希望大家多多支持猪先飞。
原文出处:https://blog.csdn.net/hjin_/article/details/116305456
相关文章
- 这篇文章主要介绍了@CacheEvict 清除多个key的实现方式,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧...2021-02-13
- 这篇文章主要介绍了浅谈redis key值内存消耗以及性能影响,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧...2021-02-07
- 这篇文章主要介绍了@Cacheable 拼接key的操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧...2021-02-13
- 下面小编就为大家带来一篇js遍历json的key和value的实例。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧...2017-01-26
- 这篇文章主要介绍了uniapp微信小程序:key失效的解决方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧...2021-01-20
antd Form组件方法getFieldsValue获取自定义组件的值操作
这篇文章主要介绍了antd Form组件方法getFieldsValue获取自定义组件的值操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧...2020-10-29- 这篇文章主要介绍了C# 遍历datatable字段名和value的案例,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧...2021-01-19
- 本文给大家介绍如何替换json对象中的key,通过实例代码给大家介绍key的替换方法,代码也很简单,需要的朋友参考下吧...2021-06-02
- 这篇文章主要介绍了解决postgresql 自增id作为key重复的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧...2021-02-04
- 本文主要介绍了react为什么不推荐使用index作为key,文中通过示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2021-07-22
- 这篇文章主要介绍了解决Pytorch修改预训练模型时遇到key不匹配的情况,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教...2021-06-05
- 本文主要介绍了Vue3中key的作用和工作原理,文中通过示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2021-10-13
jQuery Form 表单提交插件之formSerialize,fieldSerialize,fieldValue,resetForm,clearForm,clearFields的应用
这篇文章主要介绍了jQuery Form 表单提交插件之formSerialize,fieldSerialize,fieldValue,resetForm,clearForm,clearFields的应用的相关资料,需要的朋友可以参考下...2016-01-25Mysql中关于Incorrect string value的解决方案
在对mysql数据库中插入数据的时候,直接插入中文是没有问题的!但是用预编译语句时,用流对数据进行处理总报incorrect string value这个异常。本篇文章教给你解决方法...2021-09-20解决ObjectMapper.convertValue() 遇到的一些问题
这篇文章主要介绍了解决ObjectMapper.convertValue() 遇到的一些问题,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教...2021-06-30- 在本篇文章里小编给大家整理了关于python字典key不能是可以是啥类型的相关知识点,需要的朋友们可以参考下。...2020-08-04
- 这篇文章主要介绍了Redis大key多key拆分实现方法解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下...2021-01-15
- 这篇文章主要介绍了C# 获取动态key的json对象的值案例,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧...2021-01-26
- 这篇文章主要介绍了redis 解决key的乱码问题,并清理详解,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧...2021-01-15
记录无法安装mysql-Invalid GPG Key from file:/etc/pki/rpm-gpg/RPM-GPG-KEY-mysql的解决办法
在aliyun上安装MySQL时由于上次错误卸载mysql 导致校验文件出问题。下面小编给大家分享记录无法安装mysql-Invalid GPG Key from file:etcpkirpm-gpgRPM-GPG-KEY-mysql的解决方法,需要的朋友参考下吧...2017-01-15