Ad
How To Fetch Json With React-Table Library
the example to which I refer is the following: https://codesandbox.io/s/github/tannerlinsley/react-table/tree/master/examples/sub-components
I would like to fetch a json file and pass the elements of the latter into the table instead of generating them as in the previous example. The instructions for making fetch are clear to me but I can't understand how to integrate them in the "makeData" file.
This is my "makeData" code:
import ReactDOM from 'react-dom';
const range = len => {
const arr = []
for (let i = 0; i < len; i++) {
arr.push(i)
}
return arr
}
const newPerson = () => {
fetch('http://localhost:5000/api/azienda')
.then(res => res.json())
// .then((rows) => {
// ReactDOM.render(this.makeData(rows), document.getElementById('root'));
// });
}
export default function makeData(...lens) {
const makeDataLevel = (depth = 0) => {
const len = lens[depth]
return range(len).map(d => {
return {
...newPerson(),
subRows: lens[depth + 1] ? makeDataLevel(depth + 1) : undefined,
}
})
}
return makeDataLevel()
}
For any advice I will thank you
Ad
Answer
Create an array in the constructor ,where the data will be stored , fetch the data from the serverlink and then put it in the table
constructor(props, context) {
super(props, context);
this.state = { items: []};
}
getList = () => {
fetch("http://localhost:5000/api/azienda")
.then(res => res.json())
.then(items => this.setState({ items }))
.catch(err => console.log(err));
};
componentDidMount() {
this.getList();
}
Ad
source: stackoverflow.com
Related Questions
- → I can't convert Json to string [OctoberCms]
- → Uncaught TypeError Illegal invocation when send FormData to ajax
- → Laravel Send URL with JSON
- → how to write react component to construct HTML DOM
- → AJAX folder path issue
- → Chaining "Count of Columns" of a Method to Single Query Builder
- → Laravel - bindings file for repositories
- → Good solution to work with rest-api like SPA with redux?
- → getting the correct record in Angular with a json feed and passed data
- → Transformer usage on laravel/dingo API
- → Google options Page not saving - Javascript
- → Ember.js JSON API confusion
- → How can I query Firebase for an equalTo boolean parameter?
Ad