2016-12-01 45 views
6

次の一節... mapActions(...)を使ってマップされた関数に引数を渡す方法は?

export default { 
    methods: { 
    ...mapActions(["updateData", "resetData"]); 
    } 
} 

考えると、私はと呼ばれる関数にパラメータを渡すしたいと思います。 ...mapAction()コールを保持している間に正しく行う方法がわからないので、私は以下に書き直さなければならなかった。

export default { 
    methods: { 
    // ...mapActions(["updateData", "resetData"]) 
    updateData: function() { this.$store.dispatch("updateData", "names") }, 
    resetData: function() { this.$store.dispatch("resetData"); } 
    } 
} 

これは唯一の方法ですか?

答えて

7

パラメータを呼び出すメソッドにパラメータを渡すことができます。アクションで使用できるパラメータを1つだけ送信できます。

const actions = { 
    updateData: (state, data) => { 
    //You will get passed parameter as data here 
    }, 

とあなたはまだmapActionsを使用することができます。

<button @click=updateData({data1: 1, data2: 2})> 

とvuexストア内:あなたはあなたが好きそれを呼び出すことができます例えばmapActions

を使用するときに何か特別なことをする必要はありません:

export default { 
    methods: { 
    ...mapActions(["updateData", "resetData"]); 
    } 
} 

作業フィールドhereを参照してください。y OUは、アラートに渡されたパラメータを参照することができます:)ここで


mapActionsの実装であるvuex repoから

export function mapActions (actions) { 
    const res = {} 
    normalizeMap(actions).forEach(({ key, val }) => { 
    res[key] = function mappedAction (...args) { 
     return this.$store.dispatch.apply(this.$store, [val].concat(args)) 
    } 
    }) 
    return res 
} 

をあなたはそれがargsが渡さ取り、ディスパッチ関数の第2引数としてそれらを置く見ることができます。

関連する問題