Каким способом лучше отфильтровать данные для компонента?

Question

[Mikhail Rerberg]

Всем привет!

Такая ситуация:
Есть три ссылки на страницу различных товаров, к примеру: Товар1, Товар2, Товар3. Использую react-router и туда передаю один и тот же компонент для отрисовки - . Ему в props прокидываю пришедшие данные из БД (MongoDB), список всех товаров соответственно. Когда пользователь переходит на страницу 'Товар1', то компонент должен отобразить все товары, относящиеся к данной категории.
Была идея по реализации: каждому товару в бд добавить поле "type" и сравнивать его с href-ом страницы в отдельной функции, которая вернет новый props и уже отфильтрованный props передать компоненту. Но меня мучает мысль, что есть более изящные способы. Если есть, то какие?

Спасибо!

Answer 1

[Егор Живагин]

С mongo у меня было примерно так:
1) В БД создаётся коллекция, условно, "Категории товаров", где лежат ваши "Товар1", ... со всеми необходимыми параметрами + у каждого свой id, который монга генерирует. Кстати, url-ы тоже тут хранить удобно
2) В коллекции с товарами у каждого товара действительно появляется type , только там лежит id нужного объекта из "Категории товаров"
3) При переходе на страницу "Товар1" на бэкенде в запросе к БД передаются параметры для фильтрации (те же данные из url) . Не надо тянуть такие фильтрации на фронт. Зачем вам получать из БД лишние данные?
4) Фронт просто отображает всё, что пришло с бэка

ИМХО, это наиболее правильное решение, но при желании его можно как угодно упрощать, главная идея - фильтрация должна происходить на уровне БД или бэкенде, но никак не на фронте

Comments

[Mikhail Rerberg]

Спасибо за ваш ответ!
То,что вы описали, будет выглядеть так?

Коллекция категорий товаров:
{
_id: 'cat1',
'title': 'Категория 1',
'url': '/cat1'
},
{
_id: 'cat2',
'title': 'Категория 2'
'url': '/cat2'
}

Коллекция товаров:
{
'title': 'item1',
'type': 'cat1'
},
{
'title': 'item2',
'type': 'cat2'
}

[Егор Живагин]

Mikhail Rerberg, да, примерно так. Не скажу, что идеальный подход, но достаточно простой

[Mikhail Rerberg]

Егор Живагин, а какой подход был бы лучше?

[Егор Живагин]

Mikhail Rerberg, чтобы совсем субъективщины тут не писать, давайте я вам просто ссылку про разные подходы скину - вот . Вообще, на Хабре много хороших статей про связи в монге было, можете поискать

А ещё есть автоматическое связывание . Не юзал, но думаю, что это неплохо

[Mikhail Rerberg]

Егор Живагин, Благодарю вас!