高复用组件是在组件化中,常碰到的问题,如何编写高复用组件需要注意的点
避免推测的普遍性
在组件的的初期,以满足当前需求为第一要数,不要过度设计组件的通用性,导致组件变得过于复杂,而很长一段时间内业务需求都不用上,浪费了当前的工作量
简化API
复杂的 api 会导致组件难以使用
研究现有技术
例如栅格化,我们在设计组件的时候,可以参考现有技术,有没有成熟的方案提供参考
组件拆分
- 行为与展示分离
- 抽象层次
在需要的地方使用组合模式
- 复合组件
- Hoc
- Render props and renderless components
- Controlled and uncontrolled props
- controlled: 受 parent 控制保持一定的灵活性
- uncontrolled props: 封装复杂的逻辑状态
- provider pattern
可访问性
- 不同尺寸
- 不同类型的设备
样式可定制性
轻松的定制样式是前端组件好不好用的关键指标
测试: 单元测试
保证组件修改后,放心的安全上线,用过了都说好用
文档
好的组件 -> 优秀的组件
如果有人体验过没有文档的组件,应该都会明白这点