Vuex 参数传递

Posted 2023-02-22

【中文标题】Vuex 参数传递

【英文标题】：Vuex parameter passing

【发布时间】：2022-01-17 19:48:13

【问题描述】：

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

从收到的api 我需要获取 id 并将其传递给 vuex。该函数有效，但在调用时它会在控制台中写入 undefined。

vuex：

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

在 vuex 中我需要id 来比较，如果有相同的则删除。 我应该改变什么？

【参考方案1】：

使用map 函数代替forEach：

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

您的filter 函数也需要一些更改。它应该返回一个布尔值，但你忘记返回值了。

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

payload也可能是一个id数组，你应该使用includes这样的函数来检查你的情况。

【讨论】：

好的，用map我的vuex得到了id的数组，但它仍然清除了整个数组而不是传递的值。我的意思是我在vuex 中的功能没有按我想要的方式工作

答案已更新。 @亚历克斯

非常感谢！我用return !payload.includes(item.id);

【参考方案2】：

如果您不想更改 deleteCheckboxItems 的实现以采用数组包装 this.$store.commit 与 for each 像这样： response.data.items.forEach(element => this.$store.commit('deleteCheckboxItems', element) );

此外，更重要的是您的filteredBrands.filter不会过滤，因为您没有返回值。你必须return item.id === payload。