score:1
dataele
is undefined in the first render (and any subsequent renders before it is fetched). you also don't destructure it correctly in your render function. i think you likely meant to destructure descriptions
instead.
import react, { component } from "react";
import axios from "axios";
class abc extends component {
constructor(props) {
super(props);
this.state = {
descriptions: [],
};
}
componentdidmount() {
axios
.get("https://jsonplaceholder.typicode.com/users")
.then(response => {
this.setstate({ descriptions: response.data });
// if (response.data) {
// var rdata = response.data;
// for (var r = 0; r < rdata.length; r++) {
// if (r === 0) {
// // console.log(rdata[r]);
// // const {rdata} this.dataele = rdata[r]
// console.log(this.dataele.name);
// }
// }
// }
})
.catch(error => {
console.log(error);
});
}
render() {
const { descriptions } = this.state;
return (
<div>
// {descriptions.map((description, index) => (
// <p key={index}>{description.description}</p> // response data objects don't have a description property!
// ))}
{descriptions[1] && descriptions[1].name}
</div>
);
}
}
export default abc;
also, the response data shape doesn't have a description
property on it, but tbh i'm not really sure what you're even trying to do with the for-loop, it throws an error.
score:0
please try that:
class abc extends component {
constructor(props) {
super(props);
this.state = {
descriptions: [] ;
}
}
componentdidmount() {
axios
.get("https://jsonplaceholder.typicode.com/users")
.then(response => {
this.setstate({ descriptions: response.data });
})
.catch(error => {
console.log(error);
});
}
//for mapping**
return (
<div>
{this.sate.descriptions.map((description, index) => (
<p key={index}>{description.description}</p>
))}
</div>
);
}
}
score:1
quite a few problems in your code.
presumably you intended:
const { dataele } = this.setstate;
to be
const { descriptions = [] } = this.state;
Source: stackoverflow.com
Related Query
- D3 pie chart: Uncaught Type Error - Cannot read property 'pie' of undefined
- Error when trying to map a choropleth using react-leaflet-choropleth: Cannot read property 'map' of undefined
- React-redux map error TypeError: Cannot read property 'map' of undefined
- I'm getting a Cannot read property of 'exercises' of undefined error when trying to map my props
- TypeError: Cannot read property 'maps' of undefined error in reactjs google map
- function returning the data to filter and map that show error React.js TypeError: Cannot read property 'val' of undefined
- Getting Type error as cannot read property undefined
- Type Error: cannot read property ' map ' of undefined
- when I type my react js component it is doing well but when i reload the browser it gives me error Cannot read property 'value' of undefined
- Error : Cannot read property 'map' of undefined
- Node error Cannot read property 'resolve' of undefined
- Cannot read property 'getState' of undefined error
- React cannot read property map of undefined
- Map component: Cannot read property 'initialize' of undefined
- Cannot read property 'create' of undefined -- react-dates error
- Next redux wrapper arise error of Cannot read property 'getState' of undefined
- Enzyme Mount Error - TypeError: Cannot read property 'find' of undefined
- Uncaught type error: cannot read property persist of undefined with react-bootstrap carousel
- Error Cannot read property 'left' of undefined in React Semantic UI Popup with Styled Component
- Getting error Cannot read property 'setState' of undefined
- How to fix the error TypeError: Cannot read property 'map' of undefined
- Error cannot read property getState of undefined - Redux with NextJS
- Cannot read property 'push' of undefined - React error
- Cannot read property 'handleClick' of undefined when using map
- import Excel from "exceljs" throwing error on browser TypeError: Cannot read property 'prototype' of undefined
- Jest - Test gives an error TypeError: Cannot read property 'then' of undefined
- Cannot read property 'parentNode' of undefined error in ReactJS Redux form
- react component error Cannot read property of undefined
- Cannot Read Property map of undefined
- TypeError: Cannot read property 'token' of undefined error in reactjs login page
More Query from same tag
- React - toggle visibility of an element not working
- The event works in my React project, but the page stays the same. (with Spring Boot)
- React router routes don't match location
- ReactJS component state is not updating when any value in state array is modified
- Dockerizing a React App: The app starts inside the container, but it not accessible from the exposed port
- How do I update useEffect hook when clicked on a button? (how to write the button submit method?)
- I can't render the API I fetched with createAsyncThunk when I refresh the page
- How can we pass environment or config variables during run time in a cra(createreactapp)
- How to fix placeholder text within the input in material ui text field
- Problem using Render instead of Component in React
- React Code Splitting in React.createElement()
- Need to disable long click on image element
- Reactjs - window.addEventListener hashchange only working when component loads initially
- Is there a way to pass a variable as an argument in onClick handler function in an element? - React JS
- How to display data from JSON as flex row in div ReactJS
- How to format a date specifically
- Parsing error: Unexpected token when adding a conditional in react
- How to open the next page on click mouse
- Using multiple setHook makes component render more than once?
- React Button with linkto functionality add option
- Why we do extends React.Component when creating the class component in React?
- Convert JSX to JSON or String and then back again
- animate component entering the DOM in ReactJS
- Fetch additional data for a single item in a list query
- Sinon.spy() & jest.spyOn - TypeError: Attempted to wrap undefined property getTableData as function
- How to make every pool of an Array to be only once Assignable
- react-hooks: skip first run in useEffect
- React- Should I be using promises to set state?
- How to get a param from the url?
- Passing further arguments with tagged template literals