Antd-table全选踩坑记录

目录

一、需求

二、问题

​编辑三、解决

四、全选选中所有数据而不是当前页

---

一、需求

        最近遇到一个小小的需求，在我们这个项目中，有一个表格需要添加全选删除功能。这还不简单吗，于是我找到andt的官网，咔咔咔一顿cv，很快就把这个功能加上了，信心满满的开始自测，但是却发现了一些问题。

二、问题

        1.点击全选，只会选择当前页的所有选项，并且后年几页也会被选上，但选中数组中并不包含，第二页的选项，第二页的选项仍然会被勾选上。          这里数组长度只有10，但页面显示全部选择。

        2. 选择第一页的第一项，后续所有分页的第一项都会被勾选。

         3.获取的数组为对应的数据的索引下标，没有办法分辨数据。

三、解决

        实际上问题只有一个，那就是没有加对应的标识  rowKey  。少了这个玩意从而导致了包括但不限于以上的这些问题。

           还是没有好好看文档啊， 这样一设置，所有的问题都迎刃而解了。

         注意这里的  record.xx  是对应的行的某一项属性的属性值。在这里设置以后，获取的数组的内容就是对应的属性值了。

         看这里已经从索引下标变成了ID。到此为止，上面的三个问题都得到了相对应的解决。

四、全选选中所有数据而不是当前页

        在andt-table组件中的全选只是针对于当前页面的全选，如果想实现全部数据选取就需要加一个方法。

        可以在这里通过判断  selected  来将所有数据的rowkey值添加到数组中达到实现目的。