Vuex parameter passing

Question

this.$store.commit(
  'deleteCheckboxItems',
   response.data.items.forEach(element => {
     element.id;
     })
   );

From the received api I need to get the id and pass it to vuex. The function works but writes undefined to the console when called.

vuex：

deleteCheckboxItems(state, payload) {
  if(state.filteredBrands) {
    state.filteredBrands = state.filteredBrands.filter((item) => {
      console.log(payload);
      item.id == payload;
    });
  }

In vuex I need id to compare, and delete them if they are the same. What should I change?

Answer 1

If you don't want to change the implementation of deleteCheckboxItems, wrap this.$store.commit with a for every using an array, like this: response.data.items.forEach(element => { this.$store.commit('deleteCheckboxItems', element) });

Also, and more importantly, your filteredBrands.filter will not filter because you have no return value. You must return item.id === Payload.

Answer 2

Use the map function instead of forEach:

this.$store.commit(
  'deleteCheckboxItems',
   response.data.items.map(({id}) => id)
);

Your filter function also needs some changes. It should return a boolean value, but you forgot to return that value.

deleteCheckboxItems(state, payload) {
  console.log(payload);
  if (state.filteredBrands) {
    state.filteredBrands = state.filteredBrands.filter((item) => {
      return item.id == payload;
    });
  }
}

The payload may be an id array, you should use some functions like includes to check your case.