Making a filter:

Mutations

export default {
 state: {
 filteredBrands: []
},

mutations: {
 showFilteredList(state, payload) {
   state.filteredBrands.push(payload);
  }
 }
};

Methods

    loadProducts(item) {
      axios.get('/api', {
      params: {
       per_page: 20,
       filter_machinery_brands: [ item ]
      }
    })
    .then((response) => {
      this.$store.commit(
        'showFilteredList',
        response.data
      );
    });

},

item this is an input with a checkbox, when clicked, a request is made to the server for this category

For some reason, the push does not work, why? And I would like there to be a check, if the array is the same, then delete, otherwise add. Is it possible?

CodePudding user response：

If you can se an array comes in as payload. Then you are trying to push an array into an array. Which cant be done in either js or ts.

You can try set the value:

state.filteredBrands = payload;

otherwise you would have to do something like this:

state.filteredBrands.push(payload[0]);

If you wanna control for existing items in array, and assuming your are not always setting value, but pushing new values into your array. You can do something like this:

    if (state.filteredBrands.indexOf(payload[0]) === -1) {
        // Not in array
        state.filteredBrands.push(payload[0])
    } else {
        // is allready in array
        state.filteredBrands.forEach((item, index) => {
            if (item === payload[0]) {
                state.filteredBrands.splice(index, 1)
            }
        })
    }

CodePudding user response：

Yes, you can push an array into an array. I guess the problem here is your vuex config.

Vuex state is a function, so it needs to be:

state () {
    return {
      filteredBrands: []
    }
  }

And if you are using Nuxt:

export const state = () => ({
  filteredBrands: []
})