Pecha89
@Pecha89
web developer

Как обновить список после fetch запроса?

Ребят привет, подскажите плиз как реализовать чтобы при каждом запросе обновлялся список, а не добавлял в него новый результат? пример тут

js примера
let apiTagsLink = 'https://topceramica.ru/wp-json/wp/v2/posts/?search='
        let inputTags = document.getElementById('viewList')
        let reqList = document.createElement('ul')
        let parentUl = inputTags.parentNode

        inputTags.addEventListener("input", inputTextTags)

        function inputTextTags() {
            let request = inputTags.value
            fetch(apiTagsLink + request)
                .then((response) => {
                    // console.log(response)
                    return response.json()
                })
                .then((data) => {
            console.log(data)
                    
                        data.forEach(element => {
                            console.log(element.title.rendered)
                           
                                reqList.innerHTML += '<li>'+element.title.rendered+'</li>'
                                parentUl.insertBefore(reqList, inputTags)    
                        })
                    
                    
                    
                })
        }
  • Вопрос задан
  • 691 просмотр
Решения вопроса 2
Spartak-2205
@Spartak-2205
Разработка и создание сайтов
...
.then((data) => {
	console.log(data);
	var list = '';

	data.forEach(element => {
		console.log(element.title.rendered);

		list += '<li>'+element.title.rendered+'</li>';
	})

	reqList.innerHTML = list;
	parentUl.insertBefore(reqList, inputTags);
})
Ответ написан
Комментировать
@Gary_Ihar
JS *овнокодер
Тебе надо почистить свою ul. Добавь в последнем .then в самое начало reqList.innerHTML = '';
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
Pecha89
@Pecha89 Автор вопроса
web developer
В итоге взял ответ Spartak и добавил то что посоветовал Gary_lhar reqList.innerHTML = '', то что нужно) спасибо

обновил на codepen код
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы