How to correctly use Nuxt / Vue ...mapMutations

Question

I'm trying to use ...mapMutations with Vuex modules in Nuxt. My call to this.setDates(dates) results in an error:

this.setDates is not a function

In my Nuxt store: store/header.js

export const mutations = {
    setDates(state, dates) {
        state.dates = dates;
    },
}

In my component

methods: {
    ...mapMutations(
        {'header': ['setDates']},
    ),
    changeDate(dates) {
        this.setDates(dates);
    }
}

Answer 1

This will try to create a method called header using the mutation setDates:

mapMutations(
  {'header': ['setDates']},
)

I believe what you want is:

mapMutations('header', ['setDates'])

This will treat header as a namespace instead.