Всем привет, подскажите, пожалуйста, как правильно решить следующую задачу?
У меня есть некий объект:
const obj = {
people: [
{
id: 1,
firstName: 'John',
lastName: 'Smith'
},
{
id: 2,
firstName: 'Brandon',
lastName: 'Stone'
},
{
id: 3,
firstName: 'Sandoval',
lastName: 'Pratt'
},
{
id: 4,
firstName: 'Bradley',
lastName: 'Keegan'
}
]
};
При вводе в input? например: bra
<input type="text" />
Я бы хотел получить:
const obj = {
people: [
{
id: 2,
firstName: 'Brandon',
lastName: 'Stone'
},
{
id: 4,
firstName: 'Bradley',
lastName: 'Keegan'
}
]
};
Могу предположить, что подобное можно реализовать вот так (как один из вариантов)
const filterVal = document.querySelector('input').value.trim().toLowerCase().split(/\s+/);
const filterBy = ['firstName', 'lastName'];
const filtered = obj.people.filter(item => filterBy.some(prop => filterVal.some(val => item[prop].toLowerCase().includes(val))));
Если будут другие решения, буду благодарен идеям.
Итак, собственно сам вопрос:
Нпример, при click я получил необходимые данные
Мне необходимо вывести следующую стркутуру html:
<div class="autocomplete-suggestions__list">
<div class="autocomplete-suggestion__item">
<div>
Keegan
<strong>Bra</strong>
dley
</div>
<div>
<strong>Bra</strong>
ndon Stone
</div>
</div>
</div>