VUE数据模型设计思想指导

本文探讨了在MVVM框架下,特别是Vue.js中进行数据模型设计的思考与实践。作者提出添加namespaced来隔离业务模块,通过模块化管理data model,并详细介绍了如何组织mutations和actions以提高代码复用性。在实际应用中,通过重用的方法处理增删改查操作,并提供了灵活的结构适应不同需求。文章还讨论了在使用这些模型时的统一性和便利性,如统一的list操作接口。
摘要由CSDN通过智能技术生成

这是我放在githb上关于vue模型设计的一个思想,目前还在更新中…
如果有更好的建议,欢迎评论哦
github 模型设计

1. 模型设计

在 MVVM 下面的模型设计,如果没有一定的准则,才开始开发很容易随意定节点,然后随意挂载

在经历我们项目的一轮重构之后, 我们的模型设计原则:

  1. 添加 namespaced,用以隔离各个业务模块的 mutations, actions。
  2. 结构类似,以 namespaced 及节点名字区别此 data model 属于哪个业务。
  3. data model 中如果存在其他业务模型,则用 module 的方式挂载
  4. 在使用的命名空间之后,很多方法其实都是类似的,比如获取列表页面,删除,增加,唯一不同的是里面的 API 名字
    针对 mutations 写全重用的方法,在业务中合并入可重用的所有方法
    针对 Action, 可抽象出所有的相似的点在重用的公共方法中
  5. 在 Action 中覆盖动态更新的变动,如果在页面子页面做了删改增加的动作,需要刷新,则直接在 vm 中更新,页面不需要跟随变化做任何处理
  6. 在公共重用的文件中包含:
    a. data model 中分页的结构
    b. mutation 中的获取数据(包含条件查询),修改数据
    c. action 中修改数据,删除数据,刷新列表数据
<
  • 2
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值