vuex的store，state存储数组还是map？

Question

请教一个vuex的问题，我要做个游戏工具，初始化加载很多数据到前端。
比如[{'goods_id':'1', 'goods_name': '物品1'},{'goods_id':'2', 'goods_name': '物品2'},……]
逻辑上的操作以及页面的展示，很多都要用到 map类型的数据，比如 goods_map.get(goods_id).goods_name
但页面上列表展示，只能遍历数组 v-for="item in goods" {{ item.goods_name }}

怎么保存或者处理数组和map这2种数据更好呢？从规范、效率等方面考虑，我目前想了这3种方式：
1、store同时存储 数组和map，在页面初始化的时候都保存：
state: {

goods: [],
goods_map: new Map()

},
mutations: {

SET_GOODS: (state, goods) => {
  goods.forEach(item => {
    state.goods.push(item);
    state.goods_map.set(item.goods_id, item);
  });
},

2、state只保存数组goods，再在getter里面加一个遍历数组返回map的方法，包装成map返回。页面需要展示数组的地方，就用 ...mapGetters。

3、state只保存map类型的goods_map，再在getter里面加一个遍历数组转成map的方法，包装成数组返回。

或者还有其他什么好方式？求赐教。

Answer 1

遇到类似需求我会直接用object

state: {
  goods: {},
},
mutations: {
  SET_GOODS: (state, goods) => {
    goods.forEach(item => {
      Vue.set(state.goods, item.goods_id, item);
    })
  },

兼顾v-for循环以及直接通过id取值的需求 goods[goods_id].goods_name，
可以参考下