将嵌套的JSON对象转换为特定的数组格式

Question

我有一个嵌套的JSON对象，看起来像下面这个JSON对象，我必须转换成一些特定的格式，我在下面给出:

let jsonObj ={"data": {
"cardShop": {
"cardData": {
"cardTitle": "The Platinum Card<sup>®</sup>",
"cardType": "credit-cards",
"dtmProductName": "PlatinumCard",
"viewAllCards": {
"url": "credit-cards/all-cards",
"text": "All Cards"
}
},
"eligibilityChecker": {
"header": "Check your eligibility",
"subHeader": "The Platinum Card®",
"bulletPoints": [
"Only takes a couple of minutes to complete",
"Will not impact your credit rating",
"Allows you to apply with confidence"
]
}
}
}
}

上面的JSON对象，我必须把它转换成下面的格式与一些新的属性，如键，标题，parentId, id等。

[
{
id: "cardShop",
key: "cardShop",
title: "cardShop",
selectable: false,
children: [
{
id: "cardData",
path:"cardShopCardData"
key: "cardData",
title: "cardData",
parentId: "cardShop",
selectable: false,
children: [
{
id: "cardTitle",
path :"cardShopcardDatacardTitle"
key: "cardTitle",
title: "cardTitle",
parentId: "cardData",
isLeaf: true,
children: []
},
{
id: "cardType",
key: "cardType",
title: "cardType",
parentId: "cardData",
isLeaf: true,
children: []
},
{
id: "dtmProductName",
key: "dtmProductName",
title: "dtmProductName",
parentId: "cardData",
isLeaf: true,
children: []
},
{
id: "viewAllCards",
key: "viewAllCards",
title: "viewAllCards",
parentId: "cardData",
selectable: false,
children: [
{
id: "url",
key: "url",
title: "url",
parentId: "viewAllCards",
isLeaf: true,
},
{
id: "text",
key: "text",
title: "text",
parentId: "viewAllCards",
isLeaf: true,
}
]
}
]
},
{
id: "eligibilityChecker",
key: "eligibilityChecker",
title: "eligibilityChecker",
parentId: "cardData",
selectable: false,
children: [
{
id: "header",
key: "header",
title: "header",
parentId: "eligibilityChecker",
},
{
id: "subHeader",
key: "subHeader",
title: "subHeader",
parentId: "eligibilityChecker",
},
{
id: "bulletPoints",
key: "bulletPoints",
title: "bulletPoints",
parentId: "eligibilityChecker",
},
{
id: "image",
key: "image",
title: "image",
parentId: "eligibilityChecker",
}
]
}
]
}
];

我试过下面的事情。对于每个对象，我需要一个parentId。

let prevKey =""
const iterate = (obj) => {
Object.keys(obj).forEach(key => {
if (typeof obj[key] === 'object' && obj[key] !== null) {

let c ={
id:key,
title:key,
selelected:false,
children:[]
};
if(prevKey && Object.keys(output).length === 0){
output ={
children :[]
}
output.children.push(c)
}
else if(prevKey ){
output.children.push(c)
} else{
output = c
}
prevKey = key;
iterate(obj[key])
}
else{
let c ={
id:key,
title:key,
selelected:false,
children:[]
};
output.children[0].children.push(c)
}
})
}

我已经尝试使用递归，但不知何故我无法得到预期的输出。

Answer 1

你可以这样做

const transform = data => {
const loop  = (data, parent) => Object.entries(data).map(([key, value]) => {
let additional = parent? {
parentId: parent
}:{}

if(typeof value === 'object' && !Array.isArray(value)){
additional = {
...additional,
selectable: false,
children: loop(value, key)

}
}else{
additional.isLeaf = true
}

return {
id: key,
key,
title: key,
...additional
}
})

return loop(data)
}

let jsonObj = {
"data": {
"cardShop": {
"cardData": {
"cardTitle": "The Platinum Card<sup>®</sup>",
"cardType": "credit-cards",
"dtmProductName": "PlatinumCard",
"viewAllCards": {
"url": "credit-cards/all-cards",
"text": "All Cards"
}
},
"eligibilityChecker": {
"header": "Check your eligibility",
"subHeader": "The Platinum Card®",
"bulletPoints": [
"Only takes a couple of minutes to complete",
"Will not impact your credit rating",
"Allows you to apply with confidence"
]
}
}
}
}
console.log(transform(jsonObj.data))