Remove duplicates from nested map objects javascript

Question

I'm displaying data on a grid using a nested map which looks like

{
    this.state.rows.map((qc) =>
        qc.BinsByDayByOrchardsQCs.map((qc2) =>
            qc2.BinsByDayByOrchardsQCsDefects.map((qc3) =>
              {console.log("results", qc3.Defect)}
                <div className="row table">
                    {qc3.Defect}
                </div>
            )
        )
    )
}

Which returns data that looks like this

results Scuff results Sunburn results Bruise results Hail damage results Scuff results Sunburn results Bruise results Scuff results Sunburn results Hail damage

How to get rid of the duplicates? I have tried

{console.log("unique",[...new Set(qc2.BinsByDayByOrchardsQCsDefects.map((qc3) => qc3.Defect))])} but that returns each iteration of the mapped object

Can you show actual data? this.state.rows

Maheer Ali
– Maheer Ali

2019-04-23 01:28:46 +00:00
Commented Apr 23, 2019 at 1:28 — Maheer Ali
– Maheer Ali, Commented Apr 23, 2019 at 1:28

Maheer Ali · Accepted Answer · 2019-04-23 01:35:05Z

3

The simple way is that create an array in which you push the elements that are printed.And before printing the other check if its present in array or not.

const arr = [];
{
    this.state.rows.map((qc) =>
        qc.BinsByDayByOrchardsQCs.map((qc2) =>
            qc2.BinsByDayByOrchardsQCsDefects.map((qc3) =>
              {!arr.includes(qc3.Defect) && arr.push(qc3.Defect) &&
                (<div className="row table">
                    {qc3.Defect}
                </div>)
              }
            ) 
        )
    )
}

answered Apr 23, 2019 at 1:35

Maheer Ali

36.5k8 gold badges53 silver badges83 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

invrt Over a year ago

When using {console.log("testing", qc3.Defect)} I can see the desired result, however, nothing is actually being rendered...

Collectives™ on Stack Overflow

Remove duplicates from nested map objects javascript

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related