Возможно я что-то неправильно понимаю и делаю не так, с удовольствием бы почитал на эту тему.
Я понимаю так, что если мне нужны данные на fronte, я делаю запрос на сервер, а если нужно отфильтровать данные то через параметры делаю новый запрос на сервер, а он в свою очередь берет данные из базы по выборке.
Снизу код который отдает данные и если указать параметр цвет то фильтрует данные
router.get('/products', function (req, res, next) {
const {color} = req.query;
const query = {};
if (color) {
query.color = color;
}
Products.find(query).then(function (products) {
res.send(products);
})
});
И теперь вопрос на счет запросов к серверу через vuex.
нормальной практикой так использовать для фильтрации данных?
state: {
products: [],
},
mutations: {
SET_PRODUCTS(state, products) {
state.products = products
},
},
actions: {
loadFilterProduct({commit}, [p1,p2]) {
const url = 'http://localhost:5000/api/products';
let options = {
params: {
color: p1,
compositions: p2
},
'paramsSerializer': function(params) {
return qs.stringify(params, {arrayFormat: 'repeat'})
},
};
axios
.get(url, options)
.then(r => r.data)
.then(products => {
commit('SET_PRODUCTS', products)
})
}
}
В компоненте через v.-modal из чекбокса получаю value и оно фильтрует данные, но я уверен, что я двигаюсь в неправильном направлении
data() {
return {
checkedColors: [],
checkedCompositions: []
}
},
methods: {
search(){
this.$store.dispatch('loadFilterProduct', [this.checkedColors, this.checkedCompositions])
}
},
Фильтров будет много
Может кто написать как правильно должно работать списком.
а я уже буду гуглить