score:2
Accepted answer
note: i would have commented but i do not have enough reputation.
the issue with the code you provided is that you do not return anything from your mapping function.
{comments.comments_images.map((child,i) =>{
<div key={i}>
<img src={child.s3_url} classname={classes.magetty} />
</div>
})}
instead
{comments.comments_images.map((child,i) =>{
return (
<div key={i}>
<img src={child.s3_url} classname={classes.magetty} />
</div>
)
})}
also if do not loop over all your comments first you might have issues also. make sure you map over the comments
array then you map again over the comments_images
. because your current implementation of the map is comments.comments_images
while comments
is an array.
score:2
the map function is not returning anything.
try the below code...
<grid classname={classes.gridlist}>
{comments.comments_images.map((child, i) => (
<div key={i}>
<img src={child.s3_url} classname={classes.magetty} />
</div>
))}
</grid>
or
<grid classname={classes.gridlist}>
{comments.comments_images.map((child, i) => {
return <div key={i}>
<img src={child.s3_url} classname={classes.magetty} />
</div>
})}
</grid>
Source: stackoverflow.com
Related Query
- How to show the image links in an array of an object with map function in React?
- how to compare id of html element inside of a map function with the id of an object outside of the map function
- how do i update state in react for updating the value of an object inside an array using array.map function
- How can use my object like a array using with map function
- React - How to show skeleton placeholders until Array map function ended
- React - map function sets the input values only with the last item in the array
- How to add an image in the first react component and ignore in rest of the components using map function
- How do the map function that return an object with modified keys? (JS, React.js)
- What is the best way to define "KEY" in React when creating a list with map function from an array which containing no unique ID or fields?
- How to update value of a key in object in an array with the new value in React useState in TypeScript
- How to get the index of an array map , out of the map function in React
- How to manipulate the DOM inside of map function using onChange event on one of the checkboxes with react hooks
- How can I set a specific position to array elements with the map function and a given index?
- Convert object to array with Lodash _.map and use map function in React
- How to map through an Array of object with the same data on some object and get it displayed once and also get other properties
- How to show in a list, visible markers in the google map with React
- React Native: How do I apply a custom function to an array of objects and return the modified array in Javascript with an additional field?
- How to pass both image file and object with values from React and retrieve it on the Node.js (express) server?
- How to create an image background fade when mapping an array of images with React
- How do I show the Google passport oAuth consent screen in the react frontend, not with express views template
- How to find object in array and show it in React component?
- React js useState hook. How to update state of a json object with an a array in it when a checkbox is clicked
- How to map inside map function and show the data in Reactjs
- how to pass the current item to the function so that i can remove it from array in react component?
- How to use if statement in array map function with next.js
- How to select random object from array with React Hooks?
- How to push an object into an array with React Hooks
- How to add items into specific Id using the react array map method
- React : how to pass and array from inside a Function to the return (JSX)
- How to structure a component using React Hooks with an object that uses the DOM directly? (such as OpenLayers)?)
More Query from same tag
- How would I make this accordion responsive and also centered on the page?
- React, update state in a loop
- min() in withStyles
- React js get value of component's state from container
- Authentication for GitHub API v4 with Apollo-Client
- I can't write in the TextFields
- React js ecommerce price change when size and material variants option selected
- Data from API: Retrieving specific data JS
- Correct way to update array from setState - Typescript , ReactJS
- how to copy json output on button click?
- Compiler not throwing "Cannot find module" error
- Axios - New Instance overrides Global Defaults
- How not to refresh the page after onClick
- Solving linter error- 'shallow' is not defined no-undef
- Error when calling a function from the child to change the state of the parent
- get Object data from Firestore with order
- What are the ways to switch between components in a chrome extension in React?
- Node.js Google Cloud Storage Get Multiple Files' Metadata
- Dynamic import images from folders
- Seating Plan generator in React
- I'm getting 'Uncaught TypeError: Cannot read property 'records' of undefined' when trying to re render my UI (using React.js and Rails)
- add comment jsx logic
- How to inject a window variable in a storybook?
- React: Using Child checkbox to update Parent component's state
- Do I need use inheritance for react components?
- How to add "colSpan" attribute in ReactJS
- How to properly handle subscriptions depending on property
- Reactjs: setState always fails and returns undefined in componentDidMount
- The CSS modules in React.js do not load
- What is the type of a function component in React?