在 VueX 中跨多个商店数组查找匹配项

Question

Currently when I want to find single item in an array that is in store I use this:

this.matched = this.$store.state.itemlist.find(itemId=> {
      return itemId.id == "someid";
    });

Lets says I want to go over multiple arrays to find the matching item given provided ID? Like i have itemlist1 itemlist2 itemgetter() ... Some of the arrays are getters ( but I think it doesnt change much). So basically I want to search over different state and getter items in this component instead of searching over one as in example above.

Answer 1

if you just want to find if its exist in one the arrays you can simply write function like this

function find(search,...arrs){
  return arrs.flat(1).find(item => item == search) 
}

this function merge all arrays to one long array and search in it

example of usage

let a=[1,2,3,4]
let b=[5,6,7,8]
let c=[9,10,11,12]

let i=find(6,a,b)
console.log(i)

Answer 2

Using one object to group all the arrays, so that will be possible to iterate over them. The idea is something like below:

const store = new Vuex.Store({
 state: {
    itemsGroupArrays: {
      items1: [{ id: 1, text: "item1 - 1" }, { id: 2, text: "item1 - 2" }],
      items2: [{ id: 3, text: "item2 - 1" }, { id: 4, text: "item2 - 2" }]
    }    
  },
  getters: {
    getItemByIdFromStateGroupArrays: state => (id) => {
      let returnedItem = null;
      Object.values(state.itemsGroupArrays).forEach((itemStateArray) => {
        if (itemStateArray.some(item => item.id === id))  {
          returnedItem = itemStateArray.find(item => item.id === id);
        }
      })                
      return returnedItem;
    }
  }
});