JS - Add new key to nested object with speard operator

Question

I'm bit confused. Could you help me ? It's easy but I'm not able to solve my problem.

I have tree like that.

[{
    label: "Label 1",
    colspan: 0,
    columns: [
        {
            data: "Colunm1"
        },
        {
            data: "Column2"
        }
    ]
},
{
    label: "Label 2",
    colspan: 0,
    columns: [
        {
            data: "Column3",
            editor: false
        },
        {
            data: "Column4"
        },
        {
            data: "Column5"
        }
    ]
},
{
    label: "Label 3",
    colspan: 0,
    columns: [
        {
            data: "Column6"
        },
        {
            data: "Column7"
        },
        {
            data: "Column8"
        }
    ]
}]

As you can see there is an editor key inside second object columns array. I want to add editor key to same level inside all object with spread operator.

I started to write the code but I'm stuck.

this.columns = [...this.columns, ...item.columns];

Also I have this.columns definition in constructor hook. So, I want to create new copy into this definition. Above data structure is imported from another file and I'm iterating that for create a new copy of columns array.

score 4 · Accepted Answer · answered Feb 26 '20 at 06:54

I am assuming like you want to add editor: false in each column.

const tree = [{
    label: "Label 1",
    colspan: 0,
    columns: [
        {
            data: "Colunm1"
        },
        {
            data: "Column2"
        }
    ]
},
{
    label: "Label 2",
    colspan: 0,
    columns: [
        {
            data: "Column3",
            editor: false
        },
        {
            data: "Column4"
        },
        {
            data: "Column5"
        }
    ]
},
{
    label: "Label 3",
    colspan: 0,
    columns: [
        {
            data: "Column6"
        },
        {
            data: "Column7"
        },
        {
            data: "Column8"
        }
    ]
}]

const res = tree.map(ele => {
    const columns = ele.columns.map(c => ({...c, editor: false }))
    ele = {...ele, columns}
    return ele
})

console.log(res)

Thank you, this is what I'm looking for. I think I need to rest because it's very easy question for ask. Anyway maybe newbies will find this solution. :) — Yasin Yörük, Feb 26 '20 at 07:57

JS - Add new key to nested object with speard operator

1 Answers1