title: Show and map JSON object on ReactJs Table
body: <p>I wanted to map and show my table content inside the JSON object, inside a table component in ReactJS.
  I am using <a href="http://react-table.js.org" rel="nofollow noreferrer">React-table library</a> for the component to show the table, and according to the documentation, it accepts 2 props which is column and the data.</p>
  
  <p>From the NodeJS endpoint, i managed to fetched 2 object, which is :</p>
  
  <p>The Fields</p>
  
  <pre><code>"fields": [
  {
    "COLUMN_NAME": "quizID"
  },
  {
    "COLUMN_NAME": "question"
  },
  {
    "COLUMN_NAME": "choice1"
  },
  {
    "COLUMN_NAME": "choice2"
  },
  {
    "COLUMN_NAME": "choice3"
  },
  {
    "COLUMN_NAME": "choice4"
  },
  {
    "COLUMN_NAME": "answer"
  }
  </code></pre>
  
  <p>],</p>
  
  <p>and the Table Content</p>
  
  <pre><code>"isi": [
  {
    "quizID": 1,
    "question": "Pertanyaan",
    "choice1": "Pilihan1",
    "choice2": "Pilihan2",
    "choice3": "Pilihan3",
    "choice4": "Pilihan4",
    "answer": "Jawaban"
  },
  {
    "quizID": 2,
    "question": "Pertanyaan",
    "choice1": "Pilihan1",
    "choice2": "Pilihan2",
    "choice3": "Pilihan3",
    "choice4": "Pilihan4",
    "answer": "Jawaban"
  }, so on--
  </code></pre>
  
  <p>I've also managed to set both object in node and fetch in from the react as one object. Here's the fetch script</p>
  
  <pre><code>componentDidMount() {
      let self = this;
      fetch('http://localhost:5000' + par, { 
          method: 'GET'
      }).then(function (response) {
          if (response.status &gt;= 400) {
              throw new Error("Bad response from server");
          }
          return response.json();
      }).then(function (data) {
          self.setState({ dataTabel: data.fields }); //settings the fetched data to state
          self.setState({ columnTabel: data.isi });
  
          console.log(self.state.dataTabel)
          console.log(self.state.columnTabel)
      }).catch(err =&gt; {
          console.log('caught it!', err);
      })
  }
  </code></pre>
  
  <p>I call the component of React table inside render() with both the dataTabel state and columnTabel state as props, but the table won't show any data.
  I've tried using the map function but haven't managed to make it work either.</p>
  
  <p>Any help will be appreciated.</p>