在项目开发中,组件库设计一定要遵循一定原则
1、标准性
任何一个组件都应该遵守一套标准,可以使得不同区域的发人员据此标准开发出一套标准统一的组件
2、独立性
- 描述了组件的细粒度,遵循单一职责原则,保持组件的纯粹性
- 属性配置等 API 对外开放,组件内部状态对外封闭,尽可能的少与业务耦合
3、复用与易用
- UI差异,消化在组件内部(注意并不是写一堆if / else )
- 输入输出友好,易用
4、适用 SPOT 法则
Single Point Of Truth ,就是尽量不要重复代码,出自《 The Art of Unix Programming 》
5、避免暴露组件内部实现
6、避免直接操作 DOM ,避免使用 ref
使用父组件的 state 控制子组件的状态而不是直接通过 ref操作子组件
7、入口处检查参数的有效性,出口处检查返回的正确性
8、无环依赖原则( ADP )
9、稳定抽象原则( SAP )
- 组件的抽象程度与其稳定程度成正比
- 一个稳定的组件应该是抽象的(逻辑无关的)
- 一个不稳定的组件应该是具体的(逻辑相关的)
- 为降低组件之间的耦合度,我们要针对抽象组件编程,而不是针对业务实现编程
10、避免冗余状态
- 如果一个数据可以由另一个 state 变换得到,那么这个数据就不是一个 state ,只需要写一个变换的处理函数,在 Vue 中可以使用计算属性
- 如果一个数据是固定的,不会变化的常量,那么这个数据就如同 HTML 固定的站点标题一样,写死或作为全局配置属性等,不属于 state
- 如果兄弟组件拥有相同的 state ,那么这个 state 应该放到更高的层级,使用 props 传递到两个组件中
11、合理的依赖关系
父组件不依赖子组件,删除某个子组件不会造成功能异常
12、扁平化参数
除了数据,避复杂的对象,尽量只接收原始类型的值
13、良好的接口设计
- 把组件内部可以完成的工作做到极致,虽然提倡拥抱变化,但接口不是越多越好
- 如果常量变为 props 能应对更多的场景,那么就可以作为 props ,原有的常量可作为默认值
- 如果需要为了某一调用者编写大量特定需求的代码,那么可以考虑通过扩展等方式构建一个新的组件
- 保证组件的属性和事件足够的给大多数的组件使用
14、API 尽量和已知概念保持一致
<完>
post SAP-Garson
原文链接:https://www.cnblogs.com/mooz88/p/16019110.html文章来自于网络,如果侵犯了您的权益,请联系站长删除!