Раскрыл запись и вынес наверх то что необязательно задавать налету:
const nameFilterUpper = nameFilter.toUpperCase();
const wrapItemNameInSpan = (item) => `<span class="name">${item.name}</span>`;
// сейчас у тебя так
const render = () => {
document.body.innerHTML = users.filter((item) => {
const itemNameUpper = item.name.toUpperCase();
// естественно .map не функция, т.к. .includes возаращает Boolean, а у Boolean нет метода .map
return !nameFilter || itemNameUpper.includes(nameFilterUpper).map(wrapItemNameInSpan).join(``)
});
}
// а должно быть так
const render = () => {
document.body.innerHTML = users.filter((item) => {
const itemNameUpper = item.name.toUpperCase();
return !nameFilter || itemNameUpper.includes(nameFilterUpper)
}).map(wrapItemNameInSpan).join(``);
}
Так гораздо очевиднее проблема.
Если вы пока теряетесь в коротких записях рекомендую всё расписывать подробно, а не в одну строчку, так гораздо меньше шанс запутаться.
|