vuex 2.0 中的 getters 是否能添加额外的参数支持？

[lanlin]

你好，首先感谢 vue 2.0 带来的一系列新的变化。

我们现在在项目中遇到一个很棘手的问题。
现在的 getters 方法只接受第二个参数为 其他 getters 的情况。

但是，我们觉得如果 getters 能接收其他的额外参数的话，将会更加便捷。
比如，我希望将一个产品的ID，作为一个额外的参数传递给 getters，
以便能够通过 getters 中的某个方法筛选出该条数据并返回。

下面这个例子是我们希望能够达到的效果：

getters: {
    getProductByid: (state, id) =>
    {
        return state.productList.find(item => item.id === id);
    }
}

当然，我知道，我也可以在具体组件里面通过额外的 computed 或者 method 达到相同的效果。
但是，那样子的话，每次要取类似的数据，都得在不同的组件里面反复的写相同的方法来进行筛选。
这样子就太麻烦了点。

比如现在要在 A.vue 通过 getters 获取到具体的某个产品数据，不得不像
下面的例子去实现：

import { mapGetters } from 'vuex';

export default {
    data()
    {
        return { productId: 123 };
    }

    computed: {
        ...mapGetters([‘GET_PRODUCT_LIST’]),

        getProductByld()
        {
             return this.GET_PRODUCT_LIST.find(
                 item => item.id === this.productId
             );
        }
    }
};

但是，如果我在其他组件里面也要用到类似的东西。又需要重新写一个，
不能实现公用。我觉得这样子就比较麻烦了。

或者是其他人有什么更好的建议和实现方式吗？
谢谢告知，不甚感激！

[UranusCEO]

+1

[zhy023]

+1

[DevDavid1307]

+1

[felixfw1990]

+1

[shoujiang007]

+1

[shuang007]

+1

[xiaomeidan]

+1

[ktsn]

This used to be discussed before.

Getters are intended to be used for deriving the store state. In addition, they are effectively cached returned values thanks to Vue's computed property mechanism.

If we really want to pass some arguments from out of the store, we can return a function in getters:

getters: {
  getProductByid: (state) => (id) => {
    return state.productList.find(item => item.id === id);
  }
}

So, we are not considering to support arguments for getters.

[Niofh]

楼主,我想问下vuex在action里异步请求数据,之后mutations触发,再用getter获取,第一次成功,但是第二次刷新页面就没有呢,能不能帮我解决下

[lanlin]

@598220654 vuex 里面的东西是暂存在内存中的，你刷新页面肯定数据就掉了啊。这个是正常的，如果你要永久保存一些东西到浏览器，可以用 localStorage。要不然，你就需要重新走一遍你上面说的那个数据获取流程。

[kehuanhuan]

先可以这样定义

getters: {
    getProductByid: (state) => (id) =>
    {
        return state.productList.find(item => item.id === id);
    }
}

然后在组件中，你可以这样

使用了namespace的情况下

this.$store.getters['yournamespace/getProductByid'](id);

如果没有使用namespace的情况下：

 
this.$store.getters.getProductByid(id);