Looping through a json object in react js file [duplicate]

Question

I have my json object array as

 {
  "_index": [
    "houseid"
  ], 
  "added": [
    {
      "description": "detail about column", 
      "houseid": "la 123", 
      "\ufeffID": "154"
    }, 
    {
      "description": "detail about column", 
      "houseid": "la 123", 
      "\ufeffID": "154"
    }, 
    {
      "description": "detail about column", 
      "houseid": "la 123", 
      "\ufeffID": "154"
    }, 
    {
      "description": "detail about column", 
      "houseid": "la 123", 
      "\ufeffID": "154"
    }
  ], 
  "changed": [], 
  "removed": [
    {
      "description": "detail about column", 
      "houseid": "la 123", 
      "\ufeffID": "154"
    }, 
    {
      "description": "detail about column", 
      "houseid": "la 123", 
      "\ufeffID": "154"
    }, 
    {
      "description": "detail about column", 
      "houseid": "la 123", 
      "\ufeffID": "154"
    }, 
    {
      "description": "detail about column", 
      "houseid": "la 123", 
      "\ufeffID": "154"
    }
  ]
}

I want to apply a loop so i can present details for added, removed changed as below: description houseid effid detail about column la 123 154 detail about column la 123 154

godsenal · Accepted Answer · 2017-11-23 04:42:05Z

0

just import with some name, and get what you want.

import data from '../../result/result.json';

/* somewhere */
let to-add = data.toadd; // get field what you want.

answered Nov 23, 2017 at 4:42

godsenal

3872 silver badges14 bronze badges

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

2 Comments

wingskush Over a year ago

yes i cant access to-add as to-add = data.toadd

wingskush Over a year ago

but i want to iterate it in a loop so i can publish it in a table under <tr> and <td> tag for toadd, removed, changed

Ajay Gaur · Accepted Answer · 2017-11-23 04:44:31Z

0

You probably would want to use the forEach method of the lodash library. It will give you freedom to loop over the keys of objects as well.

_.forEach(object, (value, key) => {
    //do operations on value and key
})

If you need to render in react by looping over elements, you probably want to do something like this:

render(){
    return (
        <div>
        {_.map(elements, (item) => {
            <div>{item.name}</div>
        })}
        </div>
    );
}

You can make this work for table too. You can refer to this answer as well.

answered Nov 23, 2017 at 4:44

Ajay Gaur

5,2807 gold badges41 silver badges64 bronze badges

1 Comment

wingskush Over a year ago

i have updated the question. and map is not recognized in my table.component.js

Collectives™ on Stack Overflow

Looping through a json object in react js file [duplicate]

2 Answers 2

2 Comments

1 Comment

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

1 Comment

Linked

Related