javascript-es6: unable to destructure an array of objects. UNEXPECTED TOKEN ERROR
I have an array of objects and I am trying to destructure it so that I can directly use the property names in react-table‘s column’s accessor property.
This is the raw JSON which is actually being fetched via an API call.
[ { "dateStart": "2020-04-20T00:00:00Z", "dateStop": "2020-04-21T00:00:00Z", "sites": [ { "uuid": "c47dea20", "siteName": "columbus", "systems": [ { "systemUuid": "8f78he", "systemName": "Engine", "measurements": [ { "measurementName": "temperature1", "min": 1.1, "max": 10.5, "last": 7.2, "average": 5.2, "buckets": { "bucketSize": "4h", "values": [5.2, 4.3, 4.6, 5.2, 6.1, 6.2] } }, { "measurementName": "temperature2", "min": 1.5, "max": 10.8, "last": 7.9, "average": 5.9, "buckets": { "bucketSize": "4h", "values": [5.2, 4.3, 4.6, 5.2, 6.1, 6.2] } } ] } ] } ] } ] when I do below destructing,
let [ { uuid, name, systems: { systemUuid, systemName, measurements: { measurementName, min, max, last, average, buckets: { bucketSize, values, }, }, } } ] = sites; I get an error Parsing error: Unexpected token
This is the live example: https://codesandbox.io/s/charming-clarke-fosp4
Not sure, where I am going wrong though.
You can take sites in your state in the handleGetmeasurementsDataInfo() this way :
handleGetmeasurementsDataInfo = async function() { await axios .get("https://run.mocky.io/v3/7c15d8c2-e946-40f4-a1b9-a9a53436b388") .then(response => { // handle success console.log("measurement data:", response.data); const sites = response.data.map(e => e.sites); this.setState({ isLoading: false, measurementsData: response.data, sites: sites }); console.log("Sites: ", this.state.sites); }) [...] You can then access it from your state.
