如何解决用数组包装字符串类型的对象属性
我正在学习React和Javascript,我需要知道将一个简单对象更改为对象数组的最优雅的方法(即使它仅包含一个值)。该对象本身包含在一个对象内部。我既不是英语母语者,也不是JS专业人士,所以我知道我可能不太清楚,所以我尝试建立一个我可以做到的最佳示例:
https://codesandbox.io/s/vibrant-kilby-1me4m?file=/src/App.js
( const查询是我目前获取的数据, const wantedQueries 基本上是我正在寻找的解决方案的硬编码结果,以查看错误,我正在获取atm,请设置BREAK IT开关。)
对象由Next路由器根据查询参数创建,参数作为键,值作为..值。
当多次出现同一参数(例如,?role = guitarist&role = bassist)时,它将 创建对象数组以存储值,但是当一次出现参数(例如,&& type = person)时,它会创建一个简单的对象。
这会导致以后由地图功能处理数据的问题。
我可以在map函数级别检查其是否为数组,如果不是数组,则执行另一个不尝试映射数据的函数,但这将导致我在多个组件中更改很多代码而且我觉得将初始对象更改为数组是实现此目标的最佳方法。
感谢您的时间!
解决方法
如果这是关于遍历对象属性并将所有值强制放入数组的,则可以使用您选择的循环方法,并简单地使用Array.prtototype.concat()
,就像这样:
const src = { role: ["guitarist","bassist"],type: "person" },result = Object
.keys(src)
.reduce((acc,key) =>
(acc[key] = [].concat(src[key]),acc),{})
console.log(result)
但是我不完全确定是否像您描述的那样,额外循环遍历源数据以对其进行格式化是否比用.map()
渲染一次并有条件地选择适当的操作来循环更优雅根据值类型。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。