nuxtjs调用不带名称空间的vuex-mutation

时间:2019-04-24 21:57:21

标签: vuex nuxt.js

如何在没有模块文件名称的情况下调用突变?

store / index.js

export const state = () => ({
    counter: 0
})

store / todos.js

export const state = () => ({
    list: []
})

export const mutations = {
    add (state, text) {
        state.list.push({
            text: text,
            done: false
        })
    },
    remove (state, { todo }) {
        state.list.splice(state.list.indexOf(todo), 1)
    },
    toggle (state, todo) {
        todo.done = !todo.done
    }
}

在组件中,我可以这样称呼突变:

this.$store.commit('todos/add', e.target.value)

但是我不想写命名空间。我想使用以下命令:

this.$store.commit('add', e.target.value)

2 个答案:

答案 0 :(得分:0)

您可以通过导出namespaced变量来做到这一点

export const namespaced = false

但这不是最好的主意,最好使用模块名称以获得更好的模块化

答案 1 :(得分:0)

在相应模块的导出默认函数中将命名空间变量设置为 false namespaced: false。例如

const state = () => ({
  counter: 0
})

const mutations = {
  increment(state) {
    state.counter++
  }
}

const getters = {}

export default {
  namespaced: false,
  state,
  mutations,
  actions,
  getters
}

或将其导出为单独的变量 export const namespaced = false;

export const namespaced = false;
export const state = () => ({
  counter: 0
})

export const mutations = {
  increment(state) {
    state.counter++
  }
}