逻辑封装

[yyman001]

逻辑封装?

• 组件可复用性
• 组件内部状态
• 逻辑代码其他组件模块可复用
• 状态需要共享
• 外部调用dispatch 更新数据(依赖外部数据?其他模块数据?)

一次性数据转换?依赖?

普通组件逻辑代码

• 代码可收取为mixins模块,在其他模块引入
• 通过 外部调用commit/dispatch 更新vuex的状态
• 通过挂载 getters 获取 vuex 状态进行共享

vuex逻辑代码

• 通过在 action 区域 调用其他模块 state, getters, commit , dispatch
• 如果数据是内部依赖, 无法通过外部 commit/dispatch 更新内部数据

使用心得

个人更加偏向使用mixin,进行代码划分(拆分页面代码,免得代码都挤在一个页面,几千行代码看到脑壳痛)和进行代码模块接口规范(最大限度减少重复代码)

代码划分

• 按功能
• 按业务

• 使用范围

  代码模块接口

• 不能写在.vue, 只能写在mixins, 防止优先级问题导致无法重写接口方法
• 抽取重复代码进行类似接口方式
• 留有被调用的接口方法
• 引入实现的接口方法mixin