0

I have renderResult function that loops through array and then calling another function on each element. However, when looping through array I get an error which says movies.forEach is not function.

const renderMovie = movie => {
        const markUp = `
    <div class="col-1-of-3">
    <div class="movie" href="#${movie.imdbID}">
        <img src="${movie.Poster}" alt="${movie.Title}" class="movie__photo">
        <div class="movie__details">
            <h3>${movie.Title}</h3>
        </div>

    </div>

</div> 
`;

        elements.searchResList.insertAdjacentElement('beforeend', markUp);
    }
    //loop through the movies array receive and then call renderMovie function on every element
export const renderResults = movies => {
    movies.forEach(el => renderMovie(el));
}

 

       searchView.js:26 Uncaught (in promise) TypeError: movies.forEach is not a function
        at Module.renderResults (searchView.js:26)
        at _callee$ (index.js:56)
        at tryCatch (runtime.js:45)
        at Generator.invoke [as _invoke] (runtime.js:274)
        at Generator.prototype.<computed> [as next] (runtime.js:97)
        at asyncGeneratorStep (index.js:18)
        at _next (index.js:20)
hamid
  • 21
  • 1
  • 7
  • 2
    The error means that `movies` *isn't* an array. –  Jul 10 '20 at 13:58
  • What are you passing into `renderResults`? Where is that arg defined? – James Ives Jul 10 '20 at 13:59
  • Movies is an array contains an objects which has information about movies including name, type, poster and etc. It is not necessary to pass an argument to renderResults as will automatically call the renderMovie function on each element being looped. How ever I did pass an arguement to it but still doesnt work. like this movies.forEach(el => renderMovie(el)) – hamid Jul 10 '20 at 15:39
  • I tried rewriting the function but still says that movies.forEach is not a function. export const renderResults = movies => { console.log(movies); movies.forEach(el => renderMovie(el)); }; – hamid Jul 11 '20 at 13:14

0 Answers0