Пагинация, переменная внутри функции для цикла - PullRequest
Новая
       9

Пагинация, переменная внутри функции для цикла

0 голосов
/ 19 ноября 2018

У меня небольшая проблема с получением функции из API. У меня есть переменная currentPage вне функции Popular (), в этом случае все работает, но когда я пытаюсь объявить внутри функции Popular () эту переменную, чтобы получить приращение, то мое число по-прежнему 1. Есть ли способ получить приращение без объявления глобальной переменная, но с использованием локальной? После нажатия кнопки (nextPage ()) число currentPage ++ должно увеличиваться с каждым разом. 

let currentPage = 1;   <--- //global variable(I dont want)

popular();
function popular(page) {

        fetch("https://api.themoviedb.org/3/movie/popular?api_key=xxxxxxxxxxxxxxxxxxx&page="+ page+"")
        .then(resp => resp.json())
        .then(resp => {

            movieApi = resp;
            movieResult = resp.results;
            maxLenght = resp.total_pages;
            document.getElementById("movie-section").innerHTML = `${movieResult.map(movieCard).join("")}`;
            document.getElementById("btns-container").innerHTML = paginationCont();
            shortText();
            function paginationPage(){

                console.log("maxLenght " +maxLenght);

                const btnNext = document.getElementById("nextBtn");
                const btnPrev = document.getElementById("prevBtn");
                function prevPage() {

                    if (currentPage > 1) {
                        currentPage--;
                        popular(currentPage);
                    }
                }
                function nextPage() {
                    if (currentPage < maxLenght) {
                        currentPage++;  <-- //it does not work when it declares inside
                        popular(currentPage);

                    }
                }


                btnNext.addEventListener("click", nextPage);
                btnPrev.addEventListener("click", prevPage);

            }
            paginationPage();
        });
    }

Ответы [ 2 ]

0 голосов
/ 19 ноября 2018

На самом деле вы можете обойтись без значения currentPage, поскольку у вас уже есть параметр page, который равен local: 

popular(1);
function popular(page) {
    // ...etc ...
    // ...
    function prevPage() {
        if (page > 1) popular(page-1);
    }
    function nextPage() {
        if (page < maxLenght) popular(page+1);
    }
    // ...
}

Примечание: вы можете просмотреть орфографию переменной maxLenght; -)

0 голосов
/ 19 ноября 2018

Проблема в том, что вам нужен доступ к постоянной переменной, чтобы отслеживать текущую страницу между popular вызовами. Если вам не нужна переменная global , но вы можете использовать переменную external , один из вариантов - создать переменную currentPage, имеющую только область действия popular, и нельзя увидеть или изменить в другом месте: используйте IIFE, который объявляет currentPage и возвращает текущую popular функцию: 

const popular = (() => {
  let currentPage = 1;
  return (page) => {
    fetch( ...
    // ...
    // put the rest of the big function here
  };
})();
// make sure to call `popular` for the first time *after* the IIFE:
// function declarations are hoisted, but IIFEs are not
popular();

Хотя currentPage не локально внутри функции (page) => {, оно достигает того, что вы ищете, без какого-либо ненужного глобального загрязнения.

...