组件的划分粒度多大适宜？

[helloyxw]

ng2的项目由组件组合而成，组件的划分粒度多大最好呢？ 比如一个表格页面，有查询条件的输入框和选择框，有表格，有分页。是分成三个组件，还是就一个组件呢？

[kittencup]

对于表格来说，我经常会使用3个大功能

• 筛选
• 表格
• 分页

如果划分为组件的话，举一些常用的组件

• FilterComponent 由一系列的不同类型筛选组件组成
• - SelectFilterComponent 下拉菜单类型的筛选组件，比如筛选状态，类型等
• - InputFilterComponent 输入框类型筛选组件，比如搜索关键字等
• - SearchSelectFilterComponent 带搜索的下拉菜单，和SelectFilterComponent不一样，可搜索异步数据，当然有些人可能会把SelectFilterComponent和SearchSelectFilterComponent当做一个功能，那样可能复杂点
• - CalendarFilterComponent 日历类型筛选组件
• • CalendarGroupFilterComponent 组合一系列日历类型帅选组件，比如我要筛选2015-02-03~2015-03-04之间的数据
• TableComponent 表格组件
• • ThOrderComponent 排序组件，点击th内的某列对这个字段进行排序
• PaginationComponent 分页组件 每一部分功能可以拆分为一个独立组件，最后组合在一起

组件的优势就是可以划分很细，很灵活的组合起来，劣势就是怎么规划这些组件，怎么组合这些组件，组件之间数据怎么更好的共享等。。

组件化开发需要对项目有一定的规划和理解，才能构建出灵活的组件