Обещания и setTimeout не работают вместе - PullRequest
Новая
       23

Обещания и setTimeout не работают вместе

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

Я боролся с этим.У меня есть слайдер с отзывами.ничего особенного, но я хочу добавить переходный класс к элементу на 2 секунды, а затем удалить его.

Кроме того, я использую такие проекты, чтобы продвигать себя сильнее.Поэтому я пытаюсь сделать это с Обещаниями, а отзывы поступают от Fetch Call.

По какой-то причине setTimeout вообще не работает.Отладчик говорит, что он разрешен без использования таймера. 

     arrows.forEach((item) => {
        item.addEventListener('click',() => {
            return new Promise ((resolve,reject) => {
                container.classList.add('transition');
                setTimeout(() => {      
                    if (item.getAttribute('data-direction') == 'right'){
                        if(counter < array.length -1) {
                            counter ++;
                        } else {
                            counter = 0;
                        }
                    } else {
                        if(counter > 0) {
                            counter --;
                        } else {
                            counter = array.length -1;
                        }
                    }
                }, 5000)                
            }).then(resolve =>{
                testi(array,counter);
                container.classList.remove('transition');
            })
        });
    })

Ответы [ 2 ]

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

В вашем коде: 

return new Promise ((resolve,reject) => {
                container.classList.add('transition');
                setTimeout(() => {      
                    if (item.getAttribute('data-direction') == 'right'){
                        if(counter < array.length -1) {
                            counter ++;
                        } else {
                            counter = 0;
                        }
                    } else {
                        if(counter > 0) {
                            counter --;
                        } else {
                            counter = array.length -1;
                        }
                    }
                }, 5000)   
              })

Вы не принимаете или не отклоняете обещание.Поэтому обещание всегда остается в состоянии ожидания, и ваш обратный вызов метода then() (или catch() в случае ошибки) никогда не будет выполнен.

Вот пример: 

let prom = new Promise ((resolve,reject) => {
  setTimeout(() => {
    
    resolve('succes!')
    
  }, 5000)
});

prom.then((res) => {console.log(res); });
0 голосов
/ 18 ноября 2018

Вам необходимо позвонить resolve() в setTimeout(). 

  arrows.forEach((item) => {
        item.addEventListener('click',() => {
            // no point in returning to an event listener
           new Promise ((resolve,reject) => {
                container.classList.add('transition');
                setTimeout(() => {      
                  /// do synchronous stuff

                  // then reolve promise
                  resolve()// include any value you want passed to next `then()`
                }, 5000)                
            }).then(resolve =>{
                testi(array,counter);
                container.classList.remove('transition');
            })
        });
    })
...