我想建立一个关于电影院的网站。在一个页面上，我想显示一个时间表。我想列出一个列表，您可以看到日期，如果点击它，您会看到当天播放的电影。
这是我的json文件，其中包含数据：
{
"complex": "Budascoop",
"location": {
"City": "Kortrijk",
"Street": "Dam"
},
"schedule": [
{
"day": "Maandag",
"date": "22/05/2017",
"movies": [
{
"title": "I Am Not Your Negro",
"description": "In deze Belgische coproductie vertrekt Raoul Peck van een onafgewerkte roman van de Afro-Amerikaanse schrijver James Baldwin voor een reis door de zwarte geschiedenis die de Burgerrechtenbeweging uit de jaren zestig verbindt met het huidige #BlackLivesMatter. De tekst, geschreven in 1979, is helaas nog altijd heel actueel en bespreekt een diep geworteld racisme. De film is een treffend betoog op basis van archiefbeelden, filmfragmenten en actuele nieuwsbeelden die aan elkaar gepraat worden door de bezwerende stem van Samuel L. Jackson.",
"img": "negro.jpg",
"room": 1,
"screenings": [
"20:25"
],
"kids":false
},
{
"title": "Lady MacBeth",
"description": "De jonge Katherine leeft Northumberland in 1865. Ze is er gevangene in eigen huis en wordt er door haar sadistische echtgenoot en diens autoritaire vader tot op het bot vernederd. Leven in zo’n liefdeloze wereld moet in deze krachtige kostuumfilm wel tot excessen leiden. Wanneer Katherine een allesverzengende relatie aanknoopt met een knecht gaat het mis. Een indrukwekkende speelfilmdebuut van theater- en operaregisseur William Oldroyd.",
"img": "macbeth.jpg",
"room": 2,
"screenings": [
"20:15"
],
"kids":false
},
{
"title": "Tarde para la Ira",
"description": "Na acht jaar in de gevangenis als gevolg van een misgelopen sieradenroof wil Curro maar één ding: een nieuw leven beginnen met zijn familie. Zijn komst leidt echter tot spanningen bij zijn broer en diens vriendin, die een rustig leventje leiden. Bovendien verandert de ontmoeting met Joseph, een mysterieuze vreemdeling, zijn plannen. Hij komt terecht in een onomkeerbare, donkere reis terug naar het verleden, vol wraak. Deze debuutfilm van acteur Raúl Arévalo won recent 4 Goyas (de Spaanse variant van de Oscar) waaronder die voor Beste Film.",
"room": 3,
"img": "tarde.jpg",
"screenings": [
"20:15"
],
"kids":false
}
]
},
{
"day": "Dinsdag",
"date": "23/05/2017",
"movies": [
{
"title": "Django",
"description": "De virtuoze gitarist Django Reinhardt, geboren in een Henegouws dorp, was een Roma. Op het moment dat hij in Parijs concertzalen laat vollopen, vallen de Duitsers Frankrijk binnen. De film focust op de oorlogsjaren van de virtuoze gitarist en zoomt in op zijn poging om naar Zwitserland te vluchten. De aandacht ligt op het droevige lot van de Roma-zigeuners, een bevolkingsgroep die door de nazi’s vervolgd werden, tijdens die oorlogsjaren. De aanstekelijke muziek wordt vertolkt door het Rosenberg Trio.",
"room": 1,
"img": "django.jpg",
"screenings": [
"20:15"
],
"kids":false
},
{
"title": "March of the Penguins 2",
"description": "In March of The Penguins 2 keert regisseur Luc Jacquet terug met een even verbluffend vervolg, en voert de kijker met behulp van drones en onderwatercamera’s mee naar onherbergzame plekken op Antarctica. Ditmaal volgen we een jonge pinguïn die op het punt staat zijn eerste grote reis te maken, vol gevaar en obstakels. Het vervolgverhaal vertelt de lotsbestemming van één pinguïn, wiens krachtige en mysterieuze instincten hem in staat stellen om te overleven.",
"room": 3,
"img": "march.jpg",
"screenings": [
"20:15"
],
"kids":true
},
{
"title": "Their Finest",
"description": "In deze charmante komedie staan twee scenarioschrijvers centraal. Tijdens WOII krijgen ze de opdracht een fictiefilm te maken die het moreel van de Britten moet opschroeven. Tijdens het schrijversproces krijgen ze voortdurend nieuwe richtlijnen van het ministerie van Oorlog om het script aan te passen. Om uiteindelijk de Amerikanen ook over de streep te trekken om deel te nemen aan de oorlog moeten ze de hoofdrol herschrijven met een Amerikaanse held. Een puike verzameling Britse acteurs zijn de kers op de verrukkelijke taart.",
"room": 3,
"img": "finest.jpg",
"screenings": [
"20:15"
],
"kids":false
}
]
},
{
"day": "Woensdag",
"date": "24/05/2017",
"movies": [
{
"title": "Dries",
"description": "DRIES brengt een intiem en fascinerend portret van de Vlaamse modeontwerper Dries Van Noten wiens stijl wordt gekenmerkt door warme kleuren, exquise prints en rijke borduursels. Als één van de laatste onafhankelijke modeontwerpers bekleedt hij een unieke positie in het modelandschap. Hij staat al 25 jaar aan de top en heel wat van zijn collecties zijn iconisch te noemen. Van Noten zelf is bekend om zijn soberheid en zijn bescheidenheid, je zal hem niet vaak zien op modefeestjes en hij geeft amper interviews. Voor het eerst laat hij een camera toe in zijn professionele en persoonlijke leven; regisseur Reiner Holzemer volgde Dries Van Noten een jaar lang langsheen de creatie van 4 collecties.",
"room": 1,
"img": "dries.jpg",
"screenings": [
"18:00"
],
"kids":false
},
{
"title": "The Sense of an Ending",
"description": "Tony Webster, een gescheiden en pensioneerde man, leidt een teruggetrokken leven. Wanneer zijn verleden hem plotseling lijkt in te halen, is de rust voorbij. Hij wordt gedwongen de confrontatie aan te gaan met de waarheid over zijn eerste liefde en moet de ondraaglijke gevolgen van zijn beslissingen destijds onder ogen zien. Een verfilming naar het boek van Julian Barnes. Ritesh Batra (The Lunchbox) fileert met humor, wijsheid en een feilloos gevoel hoe een onbedachtzame of verkeerd ingeschatte handeling jouw pad voor altijd kan bepalen.",
"room": 2,
"img": "sense.jpg",
"screenings": [
"18:00",
"20:25"
],
"kids":false
},
{
"title": "After the Storm",
"description": "Ryota won ooit een prijs met zijn eerste roman maar verdient nu zijn brood als detective. Zijn gokverslaving heeft hem vervreemd van zijn ex-vrouw en zijn zoon. Na de dood van zijn vader lijken zijn bejaarde moeder en mooie ex-vrouw door te gaan met hun leven. Wanneer ze op een avond allemaal in het flatje van de oude moeder zitten, barst een tyfoon los. Ryota, zijn ex en zijn zoon kunnen niet anders dan daar te blijven om te schuilen. Een zachtmoedig, melancholisch en - verrassend genoeg - ook grappig relaas van een gescheiden man die opnieuw toenadering zoekt tot zijn vervreemde familie. Koreeda (Like Father, Like Son, Nobody Knows, …) kan als geen ander Japanse familierelaties ontrafelen.",
"room": 3,
"img": "storm.jpg",
"screenings": [
"18:00"
],
"kids":false
},
{
"title": "Tarde para la Ira",
"description": "Na acht jaar in de gevangenis als gevolg van een misgelopen sieradenroof wil Curro maar één ding: een nieuw leven beginnen met zijn familie. Zijn komst leidt echter tot spanningen bij zijn broer en diens vriendin, die een rustig leventje leiden. Bovendien verandert de ontmoeting met Joseph, een mysterieuze vreemdeling, zijn plannen. Hij komt terecht in een onomkeerbare, donkere reis terug naar het verleden, vol wraak. Deze debuutfilm van acteur Raúl Arévalo won recent 4 Goyas (de Spaanse variant van de Oscar) waaronder die voor Beste Film.",
"room": 1,
"img": "tarde.jpg",
"screenings": [
"20:15"
],
"kids":false
},
{
"title": "Their Finest",
"description": "In deze charmante komedie staan twee scenarioschrijvers centraal. Tijdens WOII krijgen ze de opdracht een fictiefilm te maken die het moreel van de Britten moet opschroeven. Tijdens het schrijversproces krijgen ze voortdurend nieuwe richtlijnen van het ministerie van Oorlog om het script aan te passen. Om uiteindelijk de Amerikanen ook over de streep te trekken om deel te nemen aan de oorlog moeten ze de hoofdrol herschrijven met een Amerikaanse held. Een puike verzameling Britse acteurs zijn de kers op de verrukkelijke taart.",
"room": 4,
"img": "finest.jpg",
"screenings": [
"20:15"
],
"kids":false
}
]
}
这就是我用JS创建列表的方式：
{
const createListItems = schedule => {
const $li = document.createElement(`li`);
$li.textContent = `${schedule.date}`;
document.querySelector(`.days`).appendChild($li);
$li.addEventListener(`click`, handleDayClick);
};
const makeListItems = schedule => {
schedule.forEach(date => {
createListItems(date);
});
};
const parse = schedule => {
makeListItems(schedule);
};
这一切都很好，所以如果你点击一个日期我会继续使用我的代码：
const handleDayClick = ({currentTarget: $li}) => {
loadFilmData($li);
};
const loadFilmData = $li => {
setActiveElement($li);
fetch(`./assets/data/buda.json`).then(r => r.json()).then(data => parse(parseMovieDetail));
}
const setActiveElement = $li => {
const $old = document.querySelector(`.active`);
if ($old) {
$old.classList.remove(`active`);
}
$li.classList.add(`active`);
}
const parseMovieDetail = date => {
const $container = document.querySelector(`.movies`);
$container.innerHTML = ``;
date.movies.forEach(movie => {
$movieList = document.querySelector(`.movies`);
const $h3 = document.createElement(`h3`);
$h3.textContent = `${movies.title}`;
$movieList.appendChild($h3);
const $img = document.createElement(`img`);
$img.setAttribute(`src`, `assets/img/${movies.img}`);
$img.setAttribute(`width`, 200);
$img.setAttribute(`height`, auto);
$movieList.appendChild($img);
const $p = document.createElement(`p`);
$p.classList.add(`description`);
$p.textContent = `${movies.description}`;
$movieList.appendChild($p);
const $div = document.createElement(`div`);
$div.classList.add(`meta`);
$movieList.appendChild($div);
const $ul = document.createElement(`ul`);
$ul.classList.add(`screenings`);
$div.classList.add($ul)
const $li = document.createElement(`li`);
$li.textContent = `${movies.screenings}`;
$ul.classList.add($li);
const $p2 = document.createElement(`p`);
$p2.textContent = `Zaal ${movies.room}`;
$div.appendChild($p2);
})
};
我现在遇到的问题如果我点击某个日期，它会显示任何内容并且它会在控制台中显示此错误：
Uncaught (in promise) TypeError: schedule.forEach is not a function