Делаю фильтр по нажатию на кнопку должно найти у item категорию которая совпадает с категорией на кнопку, эти элементы оставить а остальные скрыть. Столкнулся с проблемой что в методе setSocialSortBy я сделал массив который содержит Index элементов у которых есть эта категория matchArr = [1,3,5 ...], но не получаеться теперь отфильтровать this.items по этому новому массиву matchArr. Как это можно сделать?
json который приходит с api:
{name: 'title 1', category: 'cat 1'},
{name: 'title 2', category: 'cat 2'},
{name: 'title 3', category: 'cat 1'},
{name: 'title 4', category: 'cat 2'} ...
<button v-for="cat in cats" @click="setCatSortBy(cat)">{{cat}}</button>
<div v-if="items.length > 0">
<div v-for="item in items">{{item.name}}</div>
</div>
<script>
export default {
data() {
items: [],
cats: []
},
created () {
this.fetchItems();
},
methods: {
fetchItems() {
this.loading = true;
fetch("/api/items")
.then(res => res.json())
.then(res => {
this.items = res;
let catArr = [];
this.items.forEach((item) => {
catArr.push(item.category);
});
catArr.filter((value, index, arr) => {
if (arr.indexOf(value) === index) {
this.cats.push(value.toLowerCase());
}
});
});
},
setCatSortBy(name) {
let matchArr = [];
this.items.filter((value, index) => {
if (value.category.toLowerCase() === name.toLowerCase()) {
matchArr.push(index);
}
});
}
}
}
</script>
json
хотя бы одногоitem
из/api/items