Как на vue магазине сделать отображение категорий?

Question

[Дима Долготер]

Добрый день. Учу vue и хочу сделать интернет магазин для практики.
Есть json в котором есть товары и в каждом товаре есть поля типа название, цена, категория
Я хочу, чтоб при клике на пункт меню "телефоны" на этой странице показывались только телефоны. Я понимаю, что можно сделать computed в котором будет array.filter(item=>item.category='телефоны') и это веренет список тех товаров которые в это категории, но как сделать универсальный компонент?
например catalog.vue в котором динамически будет меняться категория?
и как с помощью router сделать domen/catalog/phones где последний пункт будет меняться в зависимости от открытого пункта меню?

Comments

[WapSter]

Где попытка реализации? Просто судя по вопросу ты не ознакомился с документаций по router, и хочешь чтобы за тебя написали огромный пласт кода.

Answer 1

[Николай]

Вам нужно понимать, что параметры передавать в computed - плохая практика,
лучше сделать метод, который принимает параметр для фильтрации и возвращает уже отфильтрованные товары, которые вы потом передаете в компонент

domen/catalog/phones, где phones - это динамический путь, вы можете у него получить через this.$router.params

и следовательно, фильтровать его уже

https://router.vuejs.org/ru/guide/essentials/neste...
вот тут отличный пример

Comments

[Дима Долготер]

т.е

methods:{
product_in_catalog(){
return  this.$store.state.products.filter(item=>item.category='телефоны')
}
}

а потом использовать product_in_catalog как итерируемый массив в v-for?