将数据传递到商店？

Question

如何将数据从我的vue组件传递到商店？

这是我的组件:

methods: {
    ...mapActions('NavBar', [
        'fix',
    ]),
    onClick: function() {
        this.fix('my-data');
    },
    ....

在商店:

actions: {           
   fix: ({ commit }) => {
    //get data here?
   },
},

Answer 1

VueJS 2.x中的动作和变异可以带有一个额外的参数(通常称为payload)和附加数据.

从关于突变的VueJS文档:

您可以将另一个参数传递给store.commit,它被称为突变的有效负载:

mutations: {
  increment (state, n) {
    state.count += n
  }
}
store.commit('increment', 10)

在大多数情况下,有效负载应该是一个对象,以便它可以包含多个字段,并且记录的变异也将更具描述性:

mutations: {
  increment (state, payload) {
    state.count += payload.amount
  }
}
store.commit('increment', {
  amount: 10
})

对于行动:

Actions支持相同的有效负载格式和对象样式分派:

// dispatch with a payload
store.dispatch('incrementAsync', {
  amount: 10
})

// dispatch with an object
store.dispatch({
  type: 'incrementAsync',
  amount: 10
})

关于如何定义操作的文档似乎不太清楚,但看起来以下应该有效:

actions: {
  incrementAsync ({ commit, state }, payload) { ... }
}