Hi I'm new in react so sorry in advance if I missed something obvious. I'm having problems with returning links from my json while using the map function. I have been trying to use the map function to return several links that are in an array in json file that I have but I seem to be doing something wrong. I would like to go through the array "Images" and get each link and print it in the console (For now. I will use it later to show the image).
Here is the result of using the code below:
[![Using file.images.src][1]][1]
If I do file.images it returns this:
[![Using file.images][2]][2]
(I have no idea why it prints twice)
Here is my code
import React, { Component } from 'react';
// Project Detail Class
class ProjectDetail extends Component {
constructor() {
super();
this.state = {
data: [
{
"id": 19,
"title": "Example 1",
"address": "Example -address",
"address2": "Example -address",
"city": "Example City",
"zipcode": "00000",
"client": "Example 1 llc",
"commercial": true,
"residential": false,
"completed": "Completed",
"featured": true,
"images": [
{
"src": "http://127.0.0.1:8000/media/images/waves.jpg"
},
{
"src": "http://127.0.0.1:8000/media/images/volcano.jpg"
},
{
"src": "http://127.0.0.1:8000/media/images/city.jpg"
}
]
}
]
}
}
// Render the page
render() {
return (
<div>
{this.state.data.map((file) => {
return console.log(file.images.src)
}
)}
</div>
);
}
} export default ProjectDetail;
The result I'm looking for is:
- http://127.0.0.1:8000/media/images/waves.jpg
- http://127.0.0.1:8000/media/images/volcano.jpg
- http://127.0.0.1:8000/media/images/city.jpg
The json file format is done by django-rest-framework (maybe thats causing it)
Thank you for your time :)
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…