I am currently working on a project with Nuxt(2), Vuex and Composition-API. Trying to fetch some "question content" data from an API like this:

const questions = computed(() => store.state['questions'].questions)
const { fetch } = useFetch(async () => {
    await store.dispatch('questions/fetchQuestions')
})
fetch()

I tried two methods to get the data in Actions.
With await:

async getQuestionDetail({ commit }, slug) {
    const resp = await this.$axios.$get(`${'api/question/' + slug}`)
    commit('setDetail', resp.data)
}

With promise:

async getQuestionDetail({ commit }, slug) {
    this.$axios.$get(`${'api/question/' + slug}`).then((response) => {
        commit('setDetail', response.data)
    })
}

When i tried to get data with await and go to the page that makes the request it works with no errors.

But when i refresh the page, i got this error:

Error: [vuex] do not mutate vuex store state outside mutation handlers.

When i get the data with a promise page works without any problems.

I would like to know what is causing this error even when i don't bind any data. What is the difference in behavior in these two methods?