score:0
this.getChartData = this.getChartData.bind(this);
score:2
fetch("https://data.cityofnewyork.us/resource/27iv-9uub.json")
.then(response => response.json())
.then(data => {
this.setState({...});
return data;
})
.catch(() => {
console.log("Promise Rejected");
});
score:3
constructor(){
super();
this.state = {
chartData:{},
}
}
componentDidMount(){
this.getChartData();
}
getChartData(){
// Ajax calls here
fetch("https://data.cityofnewyork.us/resource/27iv-9uub.json")
.then(response => response.json())
.then(data => {
// eslint-disable-next-line
let boroughs = data.map((data) => {
console.log(data.borough);
return data.borough;
})
this.setState({
chartData:{
labels: boroughs,
datasets:[
{
label:'Population',
data:[
617594,
1810450,
153060,
106519,
105162
],
backgroundColor:[
'rgba(255, 99, 132, 0.6)',
'rgba(54, 162, 235, 0.6)',
'rgba(255, 206, 86, 0.6)',
'rgba(75, 192, 192, 0.6)',
'rgba(153, 102, 255, 0.6)',
'rgba(255, 159, 64, 0.6)'
]
}
]
}
});
})
.catch(() => {
console.log("Promise Rejected");
});
}
Source: stackoverflow.com
Related Query
- New to React - using Fetch
- How to fetch the new data in response to React Router change with Redux?
- How to mock history.push with the new React Router Hooks using Jest
- Best way to create new React component using create-react-app
- Handling response status using fetch in react JS
- Accessing object in returned promise using fetch w/ react js
- fetch method is not defined using ES6 fetch in React
- Trying to get then send a cookie using react and fetch
- npm ERR! 401 Unauthorized: @babel/core@7.1.0 when using creating new react app
- React Fetch to Laravel API Creates New Session
- How to post a form using fetch in react native?
- Post an object with fetch using react js and express API server
- React Native fetch a local server using a proxy
- Unsafe legacy lifecycles will not be called for components using new component APIs. React v16.3
- Right way to fetch data with react using socket.io
- Using fetch to render json data in react app
- Fetch in a Web Worker using React
- With a React Hook, trying to fetch multiple datas using forEach
- How to set timeout in Fetch API using react js
- CORS error using fetch API - React create app
- React Hook useEffect : fetch data using axios with async await .api calling continuous the same api
- How to add new props dynamically to the component using navigator in React Native
- Using craco in new react project - what would cause this error ? (UnhandledPromiseRejectionWarning: TypeError [ERR_INVALID_ARG_VALUE]: ...)
- Fetch image from S3 Bucket using React JS
- displaying data from fetch api using react
- Express does not receive parameters via POST from React using Fetch API
- React - How to change code written in the old way when using a new approach?
- Run fetch at regular intervals using react
- React TypeScript: How to get form values, and response codes using fetch
- React > How to set focus on the input field after adding a new row by using react-table
More Query from same tag
- npm WARN deprecated tar@2.2.2: This version of tar is no longer supported, and will not receive security updates
- Can't figure out why my React Component isn't rendering?
- CXJS using parameters in Controller
- React Suspense not working with useEffect/setTimeOut
- Error: The Content-Range header is missing in the HTTP Response
- Dom parsing doesn't correctly work on React App in IE11
- Trying to perform an onLoad to render some information but nothing happens
- Creating a dynamic list of Links in react-router
- How to getState() in Redux Toolkit
- How to cancel previous express request, so that new request gets executed?
- button is not taking any filter in first click, in second it is working
- Auth.signOut dosent sign out as expected
- Keycloak-js 'init()' not executing in React app
- How is state encapsulation maintained by React when passing state as a prop to a child component?
- How can I update state twice in a Parent component from a Child component?
- Which way should I use for Connector in Redux?
- Why is react returning a TypeError: Cannot read properly 'join' of undefined?
- How add unique key in multidimensional array?
- Reactjs: problem converting <input type="file"> to custom button icon
- Route from one component to another reactjs
- React, Redux Deleting an item on click deletes all items
- React / single page / struct header/content/footer
- Antd Pro Table remove default search buttons and Implement Debounce
- Making dynamic react select component, not getting desired results,
- Restructuring JS array of objects
- React useState() & useContext() - TypeError: setState is not a function - What am I doing wrong?
- Type '{ children: Element; }' has no properties in common with type 'IntrinsicAttributes' React -typescript Context
- api methods, edit method does not work properly
- Warning: Expected server HTML to contain a matching nav in div
- React child state doesn't get updated