Vuex的进阶教程
文章目录
- 一、项目结构
- 二、严格模式
- 三、表单处理
-
- 1、出現的问题
- 2、解决办法
- 3、使用双向绑定的计算属性
- 四、测试
-
- 1、测试 Mutation
- 2、测试 Action
- 3、测试 Getter
- 4、执行测试
-
- 4.1 在 Node 中执行测试
- 4.2 在浏览器中测试
一、项目结构
Vuex 并不限制你的代码结构。但是，它规定了一些需要遵守的规则：
- 应用层级的状态应该集中到单个
store 对象中。 - 提交
mutation是更改状态的唯一方法，并且这个过程是同步的。 - 异步逻辑都应该封装到
action里面。
只要你遵守以上规则，如何组织代码随你便。如果你的 store 文件太大，只需将 action、mutation 和 getter 分割到单独的文件。
对于大型应用，我们会希望把 Vuex 相关代码分割到模块中。下面是项目结构示例：
├── index.html
├── main.js
├── api
│ └── ... # 抽取出API请求
├── components
│ ├── App.vue
│ └── ...
└── store
├── index.js <原文地址：https://blog.csdn.net/bjzhang75/article/details/143652425
免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！