Как выбирать элемент при поиске в React компонентах?

Question

[alexfrolov_xcx]

Всем привет! Задача: реализовать поиск марок по списку. ТЗ: пользователь вбивает в поисковую строку марку и список фильтруется, после того как он ввёл, у него остаётся одна марка а дальше, либо он жмёт Enter и значение сохроняется(при этом выбирается нужный input type=radio), или же он кликает по отфильтровавшемуся списку на сам input.... фильтрацию списка я написал, но вот с выбором проблемка, незнаю с чего подойти?

Answer 1

[Олег Гамега]

не знаю как реализовано у вас но предположу что бренды у вас выводятся из какой то колекции, пусть для простоты (понятно что у вас может быть redux или mobx,
данные могу быть нормализованы но это не существенно)

const brands = [{id:1, title:'Chevrolet', img:'./img_chevrole.png'},...]

выводятся обычно с помощью (не важно что это, список, таблица или карта с маркерами, принцип тот же )
{brands.map(brans=>this.renderBrandButton(brand))}

то для вывода по фильтру вам достаточно использовать функцию filter

Comments

[alexfrolov_xcx]

Олег Гамега вот код вывода и фильтрации
куда вставить ваш код? (извините за такой вопрос,я прост начинающий)

[Олег Гамега]

alexfrolov_xcx, а где вы выводите массив?
зы очень похоже на то что основу брали отсюда )
https://github.com/krambertech/react-essential-cou...

[alexfrolov_xcx]

Олег Гамега, так и есть, только немножко переделаная..

[Олег Гамега]

alexfrolov_xcx, в классе App вы должны выводить и ваши бренды из стэйта