ReactJS - Filter Nested Array of Objects-CodePudding

So I am trying to set up a filter on nested array of objects. The thing is the filter is object.
I just got the empty result.
Data sample:

obj:[
{
"success": true,
"data": {
    "purpose": {
        "label": "Purpose",
        "type": "choice",
        "value": {
            "select": "loremIpsum",
            "options": [
                {
                    "value": "loremIpsum",
                    "text": "loremIpsum"
                }
            ]
        },
        "filter_groups": [
            "sd",
            "coll"
        ],
        "checklist_groups": {
            "sd": {
                "value": null,
                "comment": [],
                "is_disabled": false
            }
        }
    },
    "description": {
        "label": "Description",
        "type": "choice",
        "value": {
            "select": "loremIpsum",
            "options": [
                {
                    "value": "loremIpsum",
                    "text": "loremIpsum"
                }
            ]
        },
        "filter_groups": [
            "dv"
        ],
        "checklist_groups": {
            "sd": {
                "value": null,
                "comment": [],
                "is_disabled": false
            }
        }
    }
}
}
]

Try to do next:

const filterData = (e) => {
let filtredData = Object.entries(obj)
    .map(item => ({
        ...item,
        filter_groups: item.filter_groups
            .filter(child => child === e)
    }))
    
return filtredData;
}

But filter wants work, how filter by nested objects?
I want to filter by filter_groups.
Do I have to use a regex to define the filter?

CodePudding user response：

Try using a predicate method to perform a boolean test and determine it obj:[] is behaving live an array

```Array.isArray(arr); // true ```

CodePudding user response：

It's really not entirely clear what exactly you want as input and how your output should be formatted. This version assumes you just want the data property of the first value of obj's array, and turns it back into an object with the same sorts of keys you had in the original (such as "purpose" or "description").

const filterData = (e) => (data) => Object .fromEntries (
  Object .entries (data) .filter (([k, {filter_groups}]) => filter_groups .includes (e))
)

const obj = [{success: !0, data: {purpose: {label: "Purpose", type: "choice", value: {select: "loremIpsum", options: [{value: "loremIpsum", text: "loremIpsum"}]}, filter_groups: ["sd", "coll"], checklist_groups: {sd: {value: null, comment: [], is_disabled: !1}}}, description: {label: "Description", type: "choice", value: {select: "loremIpsum", options: [{value: "loremIpsum", text: "loremIpsum"}]}, filter_groups: ["dv"], checklist_groups: {sd: {value: null, comment: [], is_disabled: !1}}}}}]

console .log ('"sd": ', filterData ('sd') (obj [0] .data))
console .log ('"dv": ', filterData ('dv') (obj [0] .data))
console .log ('"foobar": ', filterData ('foobar') (obj [0] .data))

.as-console-wrapper {max-height: 100% !important; top: 0}

Forgetting that outer shell, the trick here is that we convert it to an array of key-value entries with Object .entries, filter those entries by whether the filter_groups property of the value contains our target value, and convert the resulting array of entries back into an object.