and_smi
@and_smi
Just specialist

Как реализовать фильтр?

Всем привет, мне нужно сделать фильтр. Суть следующая:
есть продукты, которые находятся в общей обертке и есть фильтр с разными их категориями, предположим - Ужасы, Триллер и Драма. Так вот - мне надо реализовать фильтр, чтобы при клике на Ужасы - оставались только ужасы, при клике на Триллер - только триллеры и т.д.

Я это понимаю как сделать если просто менять свойство дисплей, но тут проблема вот в чем:
1. Изначально даются все фильмы - и ужасы и триллеры и драмы
2. При клике на ужасы - все фильмы, которые НЕ относятся к данному жанру должны удаляться из разметки (то есть очищать обертку фильмов и оставлять только те, что являются ужасами)
3. При клике на скажем вторую категорию, например Драмы - все фильмы Ужасы убираем (удаляем из разметки все фильмы) и добавляем туда все фильмы только относящиеся к драме.

Вопрос №1:
Каким образом можно сохранить все фильмы, чтобы потом можно было нужные отобразить в этой обертке?

Вопрос №2:
Будет ли это оптимизированным решением если фильмов будет, скажем, 150-200?

Вопрос №3:
Можете пожалуйста пояснить саму логику такого подхода к фильтру - я раньше фильтровал просто изменяя свойство дисплей, но тут надо конкретно еще и саму разметку менять и сохранять.

Вопрос №4:
Подскажите пжл что нужно почитать чтобы сделать такой фильтр, который я задумал?

На всякий случай скину pug-код, чтобы можно было понять про какую структуру я говорю и с чем надо работать:
.catalog
        for c in catalog
            for ci in c
                .catalog_item(data-category=ci.category)
                    a(href="/catalog/"+ci.link).item_link
                        .item_pic_wrapper
                            img.item_link_pic(src=ci.picExit alt=ci.picAlt data-src="/img/catalog/"+ci.pic)
                        p.item_link_title= ci.title
                        p.item_link_price ₽ #{ci.price}


То есть общая обертка это каталог а все что дальше это уже пошли сами фильмы
  • Вопрос задан
  • 64 просмотра
Пригласить эксперта
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы
23 окт. 2020, в 05:33
15000 руб./за проект
23 окт. 2020, в 03:00
1500 руб./за проект