[解決済み] 引数付きvuexjsゲッター

質問

のゲッターにパラメータを渡す方法はありますか？ vuex store ? のようなものです。

new Vuex.Store({
  getters: {
    someMethod(arg){
       // return data from store with query on args
    }
  }
})

コンポーネントで使用できるように

<template>
    <div>
        <p>{{someMethod(this.id)}}</p>
    </div>
</template>
<script lang="ts">
    import { mapGetters } from "vuex"

    export default {
        props: ['id'],
        computed: mapGetters(['someMethod'])
        }
    }
</script>

しかし、vuex では最初の引数は state で、2番目は他の getters . 可能でしょうか？

どのように解決するのですか？

一つの方法として、次のようなことが考えられます。

new Vuex.Store({
  getters: {
    someMethod(state){
      var self = this;
       return function (args) {
          // return data from store with query on args and self as this
       };       
    }
  }
})

しかし、getterは引数を取らないので、その理由は次のように説明されます。 スレッド :

ゲッターは状態をどのような形でも取得できることを示しますが、実際にはリデューサーです。

おそらく、リデューサーは純粋なメソッドであるべきでしょう。これはフィルタリングやマッピングなどに使うことができます。

ゲッターは、任意のコンテキストを与えることができます。computedと似ていますが、vuexのオプションでcomputed propsをgetterに結合できるようになりました。これは、コンポーネントの構造に役立ちます。

編集する。

同じことを達成するためのより良い方法は、ES6の矢印を使用することです。 ニブラム80 を使用する。 メソッド形式のゲッター ここで、ゲッターから関数を返すことで、パラメータを渡すことができます。

new Vuex.Store({
  getters: {
    someMethod: (state) => (id) => {
        return state.things.find(thing => thing.id === id)
      }
    };       
  }
})