10 lesson #9
10 lesson #9
Conversation
| const gifs = document.querySelector('#gifs') | ||
| if (gif_result) { | ||
| for (let i =0; i < gif_result.data.length; i++) { | ||
| const gif = document.createElement('div') |
There was a problem hiding this comment.
эту логику отвечающую за отрисовку стоило бы вынести в отдельную функцию
| // getFunc(event.target.value) | ||
| // }, 500)) | ||
|
|
||
| // Не знаю как избавить от глобальной переменной gif_result |
There was a problem hiding this comment.
Вызывать createElements сразу в том месте, где мы получаем эти данные, передавая их в качестве аргумента
| // При первом вводе получаю данные, видно в консоли | ||
| // Если делаю повторный запрос с другими данными, то получаю новые данные, | ||
| // Но элементы картинки отображаются с первого запроса | ||
| const debounce = (fn, delay) => { |
There was a problem hiding this comment.
Тут есть важный нюанс, debounce не используется напрямую, нам нужно сначала обернуть им функцию и потом использовать ее:
const debouncedGet = debounce(event => { getFunc(event.target.value) }, 500)
и вот теперь используем debouncedGet
| const getFunc = async (query) => { | ||
| const result = await getGif(query) | ||
| const result2 = await createEl() | ||
| const result_cache = await cacheImages() |
There was a problem hiding this comment.
сейчас cacheImages работает сложно, по сути внутри нее мы модифицируем 2 разных глобальные переменные, за изменениями очень трудно следить, лучше заменить это на простую логику внутри getFunc
if (responses[query) { // возвращаем результат из кэша и отрисовываем его } else { // запрашиваем результат с сервера // ... // не забываем записать его в кэш responses[query] = result }
No description provided.