score:1
map is not a method of an object. you can map over its keys using object.keys
.
render() {
const grouplist = object.keys(this.state.post).map((key) => {
return (
<div key={key}>
<div>{this.state.post[key]}</div>
</div>
)
});
return (
<div>{grouplist}</div>
)
}
however, there are other problems once you fix that but you should try to solve them yourself and ask other questions if you can't
score:2
this is how you map it. just change post with this.state.post
const post = {
store1: [
{ id: '0001', business: 'ministop' }
],
store2: [
{ id: '0002', business: 'grocery store' }
],
store3: [
{ id: '0003', business: 'seven eleven' }
],
store4: [
{ id: '0004', business: 'big store' },
{ id: '0005', business: 'medium store' }
]
};
console.log(object.keys(post).reduce((acccumilator, iterator) => {
return [...acccumilator, ...post[iterator]];
}, []));
/*
object.keys(this.state.post).reduce((acccumilator, iterator) => {
return [...acccumilator, ...post[iterator]];
}, []).map(data => {
return (
<div key={data.id}>
<div>{data.business}</div>
</div>
)
})
*/
Source: stackoverflow.com
Related Query
- Display array list of object in React JS
- React TypeScript: Save array of strings to state and display array in unordered list
- How to display list of mapped array onClick - React
- React Context: How do I pass an object array and display contents in Consumer?
- How can I break through React maps to display object that has two values one with an array other with string or number(result)
- React mapping object key of the array to display as table's head failed
- How to arrange nested array of object data for react table component display
- Array value appended instead of new value list display in React
- Filter object array based on category and return list of matches React TS
- Display array list from api in React JS
- React component does't display options after setting state, firestore returning empty array with object in it? I'm confused
- React filter array of object based on select dropdown list value
- Use map function for array object and display in table in React
- How to loop through an array and display data within the object of that array, in react and javascript
- How to add input value as a tag to an object array and display it in react js
- React project - Material UI Data grid display nested array object in a cell
- How to display an image or multiple images from an array of object to react frontend cart section?
- list in an object nested in an array react
- How do I get my react app to display object information in my bootstrap modal when they click on a list item?
- React display array of object to table in row span
- react Push Object to array from list of arrarys
- Display object array in react
- How do I update states `onChange` in an array of object in React Hooks
- Updating the array object in React state using immutability helper
- Update array object in React Redux reducer
- Finding an object in array and taking values from that to present in a select list
- React efficiently update object in array with useState hook
- React native mapping through array with object childs - working different as in react web?
- Replace object in array on react state
- Convert object to array in Javascript / React
More Query from same tag
- How can I access this json response object?
- React ternary operator - cannot render component
- cannot access environment secrets variables passing it from GH-pages to ReactApp
- react router error with a switch no idea what did wrong here
- How can I execute a query without await in React?
- How to access a Django rest Framework API from React
- Manipulating state with useEffect, but not correctly rendering updated from updated state
- Why do not use volumes instead of copy in the docker-compose?
- Unable to change my input types values on edit page
- TypeError: Cannot read property 'show' of null
- JSX Element does not have any construct or call signatures
- Redux: Adding items to array mutates initial state
- Antlr4 parsing templateLiteral in jsx
- `getByRole` can't find the name of the appropriate textbox
- How to conditionally render routes with react-router-dom?
- functional component not re-rendering after setState update hook
- Deploy react app to S3 script
- Material-ui - Google autocomplete address
- React.Element object internals are not shown when serialized
- TypeError: Cannot read properties of undefined - React Redux Toolkit Testing
- div in grandchild don't handle onClick event by handler passed as props
- I have a qr code maker. Wanted to ask how I can download it as a direct download in react
- Jest basics: Testing function from component
- Pass additional props to a react component
- running react and node in a single docker file without docker-compose.yml file
- Dynamic breadcrumbs using react router
- how to pass multiple parameters to the web API?
- Material UI Button - Align Ellipsis Label with Start Icon
- How to adjust whole column border in react-table
- Styled component, breaks on google chrome