【问题标题】:Vuex rootActions with several modules具有多个模块的 Vuex rootActions
【发布时间】:2018-10-27 09:37:03
【问题描述】:

我在客户端有一个 vuejs,我使用 vuex 进行状态管理。我有几个模块(在单独的文件中),但其中一些模块具有非常相似的操作,这就是我要创建 dry code 的原因。

我的目标:创建一个根操作,每个模块都可以调用它。

我的主 vuex 是这样的:

export default new Vuex.Store({
  actions: {
    rootactions,
  },
  modules: {
    users,
    classes,
    studentgroups,
    // ... other stuff
  }
})

我应该如何引用 rootactions 方法?

感谢您提前回复!

【问题讨论】:

标签: vue.js vuex vuex-modules


【解决方案1】:

“要在全局命名空间中调度操作或提交变更,请将 { root: true } 作为第三个参数传递给调度和提交。”

{ 根:真 }

https://vuex.vuejs.org/guide/modules.html

【讨论】:

  • 这是从不同模块分派根操作的正确方法。应标记为正确答案。
【解决方案2】:

如何使用常用操作创建一个单独的文件 RootActions.js

export default {
    action1: () => {
        //
    },
    action2: () => {
        //
    },
}

然后将其导入您的模块文件中,例如用户.js

import RootActions from './RootActions'

const state = {
    // state object
}

const mutations = {
    // mutations object
}

const actions = {
    // actions object
}

export default {
  namespaced: true,
  state,
  mutations,
  actions: Object.assign(RootActions, actions)
}

【讨论】:

  • 嘿!这是个好主意,我会给它一个机会。我要写解决方案!
  • 嘿!我想这将是解决方案。谢谢!
  • 刚刚编辑了答案以向模块添加新操作或重写根操作
  • 不错的一个!解构也可以解决问题{...RootActions, ...actions}
猜你喜欢
  • 2018-01-17
  • 2019-04-18
  • 2019-12-10
  • 2022-01-22
  • 2018-10-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多