vuex 使用文档小结篇

2020-06-16 05:41:34易采站长站整理

        [types.FETCH_ALL] (context,payload) {
       }
      },
    mutations: {
        [type.TOGGLE_DONE] (state, payload)
      }
    }

模块动态注册

    在store 创建之后,你可以使用 store.registerModule 方法注册模块。     


store.registerModule('myModule',{})

      模块的状态将是 store.state.myModule.

      模块动态注册功能可以使让其他Vue 插件为了应用的store 附加新模块

      以此来分割Vuex 的状态管理。

    项目结构

      Vuex 并不限制你的代码结构。但是它规定了一些需要遵守的规则:

        1.应用层级的状态应该集中到单个store 对象中。

        2.提交 mutation 是更改状态的唯一方法,并且这个过程是同步的。

        3.异步逻辑应该封装到action 里面。

          只要你遵守以上规则,如何组织代码随你便。如果你的 store 文件太大,只需将 action、mutation、和 getters 分割到单独的文件对于大型应用,我们会希望把 Vuex 相关代码分割到模块中。下面是项目结构示例


├── index.html
├── main.js
├── api │
  └── ... # 抽取出API请求
├── components
│ ├── App.vue
│ └── ...
└── store
  ├── index.js # 我们组装模块并导出 store 的地方
  ├── actions.js # 根级别的 action
  ├── mutations.js # 根级别的 mutation
  └── modules
     ├── cart.js # 购物车模块
    └── products.js # 产品模块