大家应该都熟悉，antd的组件都是基于rc-*组件开发的，table对应的是rc-table,在antd引入的情况如下图所示
- 基本用法
通过props传递过来的columns和dataSource分别渲染头部thead下的th和内容tbody下的td, 其中dataSource是antd内部有封装方法getCurrentPageData进行分页处理的
主要渲染方式是rc-table文件的table下的getChildContext，返回的是table,在BaseTable下有this.context.table,同时BaseTable获取到了this.context.table信息，在render里通过createElement将元素渲染出来，因为是通过createElement渲染的，所以tableHeader可以是组件ReactElement形式
- 选择操作
通过查看源码发现，选择操作是antd去封装的，不是rc-table
antd下的table文件下有renderRowSelection，通过rowSelection是否为true来判断，会便利列表哪些选中哪些没选中，然后将其unshift到columns上
自定义选项是header有个筛选，rowSelection有selections会渲染，作为selectionColumn的title
- 筛选和排序
这个功能也是antd的，不是rc-table的,具体排序的方法就不详细介绍，主要是toggleSortOrder所示
- 紧凑型+带边框
在antd下添加class，通过css实现，但是title和footer是在rc-table里实现的 - 可展开(嵌套子表格可以理解它的一个特例)
实现主要是在rc-table里实现的，基础icon组件是ExpandIcon,里面包括了基本的render和事件等，在ExpandRow里拼接了class，最后是在baseTable里添加到row里，实现渲染等功能
- 表头分组，table单元格的行/列合并的问题
这个是我自己接触colSpan/rowSpan属性比较少，所以一直以为是通过css样式计算合并的，但一直找不到怎么计算的，后来发现colSpan/rowSpan是td的属性，只要你设置了会自动合并。
好了，了解了colSpan/rowSpan就知道它是怎么实现的，譬如如果有5列，需要合并前3列，则只需要将第一个的colSpan设置成3，第二个第三个的设置为0(相当于第一个占有1、2、3的位置)，合并功能就完成了，是不是很简单（注意，如果你的2、3的colSpan不设置成0的话，它会有7列，并且会被挤出去）
- 树形结构(有点没弄明白)
最里层是用到了TableCell组件，TableRow是引入了TableCell，通过查找属性indentSize，发现是props 传递过来的，发现BaseTable和ExpandableTable均有引入，但通过查看传递的属性，其实是ExpandableTable引入的。
- columns中的width 和table中的scroll
9.可编辑,主要是rc-table中，tableRow里接收table传过来components.body.cell,并渲染，渲染的内容是在columns下的onCell中，通过react.createContext交互传递的（需要继续学习react.createContext）
- 可拖拽排序
主要用到React-dnd，然后每行的元素通过components+columns组合，其中下图的BodyCell主要表示的是components,而tdProps是columns传递的属性，通过React.createElement形成dom元素
- 可伸缩（同）
同10，只是采用的是react-resizable实现的，而且我在antd里也没体验出伸缩的感觉。。。。
最后进行下总结，经过对antd table的功能研究，总结了几点要点，如下：
a. 主要功能是rc-table去实现的，antd里的更多的是样式上的统一
b. 所有的功能点组件化（如：TableHeader, TableRow, tableCell），最后在BaseTable里进行组装
c. 每行的内容通过components是可变化的，React.createContext的使用等
d. antd在V4.0.0开始逐步采用react hooks和typescript（接下来需要重点研究的内容）