Могу ли я использовать "это" в mapMutations, распространяемых внутри методов экземпляра Vue?

Я хочу установить мутации Vuex следующим образом:

export default {
    props: {
        store: String
    },
    methods: {
        ...mapMutations({
            changeModel: `${this.store}/changeModel`
        })
    }
}

но я ловлю ошибку:

Uncaught TypeError: не удается прочитать свойство "store" неопределенного

Как правильно использовать реквизит внутри имени мутации модуль?

Я хочу карту this.$store.commit('form1/changeModel'), где form1 С реквизит.

11
javascript this vue.js vuex vuex-modules

3 ответов

Vuex helper mapMutations может использоваться с функцией, которая работает с this.

для этого, похоже, нет документа, но модульный тест Vuex помощников.спекуляция.js иллюстрирует рисунок. 

const vm = new Vue({
  store,
  methods: mapMutations({
    plus (commit, amount) {
      commit('inc', amount + 1)
    }
  })
})

в качестве бонуса функция позволяет передать параметр мутации, что является общим требованием.

ваши изменения кода будут:

export default {
  props: {
    store: String
  },
  methods: {
    ...mapMutations({
      changeModel(commit) { commit(`${this.store}/changeModel`) }
    })
  }
}

вызов в вашем компоненте просто changeModel() - mapMutations является заботясь о инъекции

2

Я думаю, что нет способа связать это на mapActions. Но вы можете назвать это с $store.dispatch

methods: {
  changeModel() {
    this.$store.dispatch(`${this.store}/changeModel`);
  }
}
3

это не точное решение, которое вы спросили, но его эффект тот же. Поскольку мутация является переменным параметром, очевидно, что вместо изменения имени мутации ее следует поместить в функцию в качестве входного параметра. Я бы создал действие в магазине следующим образом:

changeModel ({dispatch, commit, rootGetters}, mutationName) {
 commit(`${mutationName}/changeModel`, {}, {root: true})
})

и я бы использовал это действие в компоненте, передающем в него mutationName.

1