I want to show the total number of Likes using only pure JS. I grabbed the numbers from the JSON file but I don't know how to get the Total number of likes, I tried to use reduce method it didn't work maybe i am doing in the wron way
This is what I want to do click here for the photo This is my code
function photographerWork(JsonData, homeElement){
const homeElt = homeElement.id;
JsonData.media.forEach(element => {
if(homeElt == element.photographerId){
const domDiv = document.getElementById('photographer-work');
const newDiv = document.createElement("div");
///// the code i'am trying ////
const allTheLiks = element.likes
console.log(allTheLiks)
//////////////////////
const workTemplate = `
<div class="photo-box">
<div class="photo">
${videoOrImage(element.image, element.video, element)}
</div>
<div class="text">
<p> ${element.tags}<b>${element.price} €   ${element.likes} <i class="fas fa-heart"></i></b></p>
</div>
</div>
`
newDiv.innerHTML = workTemplate;
domDiv.appendChild(newDiv);
likesAndPrice(element, allTheLiks);
}
})
}
This is my Result click hereenter code here
This is my JSON file example
"media": [
{
"id": 342550,
"photographerId": 82,
"image": "../Photos/Tracy/Fashion_Yellow_Beach.jpg",
"tags": ["fashion"],
"likes": 62,
"date": "2011-12-08",
"price": 55
},
{
"id": 8520927,
"photographerId": 82,
"image": "../Photos/Tracy/Fashion_Urban_Jungle.jpg",
"tags": ["fashion"],
"likes": 11,
"date": "2011-11-06",
"price": 55
},
{
"id": 9025895,
"photographerId": 82,
"image": "../Photos/Tracy/Fashion_Pattern_on_Pattern.jpg",
"tags": ["fashion"],
"likes": 72,
"date": "2013-08-12",
"price": 55
},
{
"id": 9275938,
"photographerId": 82,
"image": "../Photos/Tracy/Event_WeddingGazebo.jpg",
"tags": ["events"],
"likes": 69,
"date": "2018-02-22",
"price": 55
},
{
"id": 2053494,
"photographerId": 82,
"image": "../Photos/Tracy/Event_Sparklers.jpg",
"tags": ["events"],
"likes": 2,
"date": "2020-05-25",
"price": 55
},
Before you enter the forEach()
create a local variable sum
let sum = 0;
Then inside your forEach()
do the following
sum += element.likes;
Then when the loop has finished in sum will be the total amount of likes.
Updated code.
function photographerWork(JsonData, homeElement){
let sum = 0;
const homeElt = homeElement.id;
JsonData.media.forEach(element => {
if(homeElt == element.photographerId){
const domDiv = document.getElementById('photographer-work');
const newDiv = document.createElement("div");
///// the code i'am trying ////
const allTheLiks = element.likes
console.log(allTheLiks)
//////////////////////
sum += element.price;
const workTemplate = `
<div class="photo-box">
<div class="photo">
${videoOrImage(element.image, element.video, element)}
</div>
<div class="text">
<p> ${element.tags}<b>${element.price} €   ${element.likes} <i class="fas fa-heart"></i></b></p>
</div>
</div>
`
newDiv.innerHTML = workTemplate;
domDiv.appendChild(newDiv);
likesAndPrice(element, allTheLiks);
}
})
// here you have the sum now
console.log(sum);
}
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加