How to loop array after process groupBy in React-Native

Question

i want to grouping data JSON (One JSON) base on region. and the json after grouping like in (Two JSON). and i use the two JSON for show data (Result JSON). so, how to add loop base on region after grouping, because actually i want to show data in front end like (Result JSON):

==>One JSON

data:[
        {id:1,
         status: "active",
         dataDetail: {
            id: 5,
            name: tes 1,
            region: aaa,
         }
        },
        {id:2,
         status: "active",
         dataDetail: {
            id: 8,
            name: tes 2,
            region: bbb,
         }
        },
        {id:3,
         status: "active",
         dataDetail: {
            id: 8,
            name: tes 3,
            region: aaa,
         }
        }
    ]

==> Two JSON

aaa: [
{id:1,
 status: "active",
 dataDetail: {
    id: 5,
    name: tes 1,
    region: aaa,
 }
},
{id:3,
 status: "active",
 dataDetail: {
    id: 8,
    name: tes 3,
    region: aaa,
 }
}
],
bbb: [
{id:2,
     status: "active",
     dataDetail: {
        id: 8,
        name: tes 2,
        region: bbb,
     }
    },
]

==> Result JSON

aaa:
1
3

bbb:
2

thanks

a0js · Accepted Answer · 2018-04-09 07:55:42Z

2

Using Lodash:

const jsonTwo = _.groupBy(data, instance => instance.dataDetail.region);
const resultJson = _.mapValues(jsonTwo, regionInstances => regionInstances.map(instance => instance.id));

Using plain javascript reduce functions:

const jsonTwo = data.reduce((accumulator, instance) => {
    if(!accumulator[instance.dataDetail.region]) {
        accumulator[instance.dataDetail.region] = [];
    }
    accumulator[instance.dataDetail.region].push(instance)
    return accumulator;
},{});
const resultJson = data.reduce((accumulator, instance) => {
    if(!accumulator[instance.dataDetail.region]) {
        accumulator[instance.dataDetail.region] = [];
    }
    accumulator[instance.dataDetail.region].push(instance.id)
    return accumulator;
},{});

answered Apr 9, 2018 at 7:55

a0js

1236 bronze badges

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

2 Comments

Quinn Over a year ago

thanks for your answer. but if i wanna show aaa: 1, tes 1 3, tes 2 bbb: 2, tes 3

a0js Over a year ago

I'm not sure I fully understand what you are trying to do. If you want to show the result json in a list of some sort, you will need to save the resultJson to the state and set up a render() function that populates the lists from the state.

David · Accepted Answer · 2018-04-09 09:38:54Z

1

var data =
[
   {
      "id": 1,
      "status": "active",
      "dataDetail": {
         "id": 5,
         "name": "tes 1",
         "region": "aaa"
      }
   },
   {
      "id": 2,
      "status": "active",
      "dataDetail": {
         "id": 8,
         "name": "tes 2",
         "region": "bbb"
      }
   },
   {
      "id": 3,
      "status": "active",
      "dataDetail": {
         "id": 8,
         "name": "tes 3",
         "region": "aaa"
      }
   }
];

groups =_.chain(data).groupBy('dataDetail.region');
keys = groups.map( (value, key) => key);
values = groups.map( (value, key) => _.map(value, 'id'));
result = _.zipObject(keys, values);

answered Apr 9, 2018 at 9:38

David

16.4k22 gold badges58 silver badges68 bronze badges

Collectives™ on Stack Overflow

How to loop array after process groupBy in React-Native

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related