Veux Store 未定义数组

Question

我正在从 Vuex 商店检索数据。我首先要检查数组是否存在于 Vuex 商店中，然后我要检查索引 0 处的 noProducts 对象是否不存在。

原因是 tweakwiseSortedProducts 用于两种产品，并且没有产品布尔值在前端做出反应

tweakwiseHasProducts () {
  if (this.$store.state.tweakwise?.tweakwiseSortedProducts) {
    return (
      this.$store.state.tweakwise.tweakwiseSortedProducts[0].noProducts ===
      false
    );
  }
  return false;
},

我目前的前端，经常，returns:

this.$store.state.tweakwise.tweakwiseSortedProducts[0] is undefined

在控制台中。

Answer 1

Vuex中调用值时推荐使用getter
请参考以下内容。

  getters: {
    getTweakwiseSortedProducts: (state: any) => {
      return state.tweakwise?.tweakwiseSortedProducts || [];
    },
  },

tweakwiseHasProducts () {    
  this.$store.getters.getTweakwiseSortedProducts.length ? true : false;
}

Answer 2

发生这种情况是因为 tweakwiseSortedProducts 不是未定义的，而是一个空列表。你可以试试：

tweakwiseHasProducts () {
  if (this.$store.state.tweakwise?.tweakwiseSortedProducts?.length !== 0) {
    return (
      this.$store.state.tweakwise.tweakwiseSortedProducts[0].noProducts ===
      false
    );
  }
  return false;
},

或者只是：

tweakwiseHasProducts () {
  return this.$store.state.tweakwise?.tweakwiseSortedProducts[0]?.noProducts === false;
},

如果此元素中的任何一个未定义，则为 false，如果 noProducts 确实为 false，则为 true

Veux Store 未定义数组

Array is undefined from Veux Store

javascript

vue.js

vuex

undefined