antd使用

Posted 2023-03-09

参考技术A

对于label和content的宽度，我们想着table中每一行中每一个td可以设置百分比的宽度，总和为100%即可

有时设置width不起作用。加上 display:table-cell；

设置width并超出显示省略号，官网给出讨论 https://github.com/ant-design/ant-design/issues/13825

当书写render时，当此列没有key值时，render的参数为(record),当有key值时，render的参数为(text,render)

官网给出的行选中

常用写法：

单选的时候,可简化handleRowClick：

上述选中的可以显示为20，只在下拉选项时添加“页/条”

问题描述：
最后一列为操作列，固定在最右边，随着项目复杂，从3个操作增加为4个了，然后紧跟在操作列前面的一列筛选列的筛选图标被遮挡了，不明白为啥。。。。？

问题解决：最终发现，是只给操作增加了内容，没有增加操作列的宽度导致的，所以增加操作列的宽度到合适即可。

一般都是除了导航和查询的地方，剩下的地方container全部是table的，此时洗完滚动根据container的高度自适应变化而调整，而且不滚动时，分页在页面最底部,此时需要增加样式：

将table配置中 scroll: y: \'calc(100% - 46px)\' ,46是因为每行高是46

此时左或右固定时滚动会出现错位，增加样式：

每个formitem中只能写一个校验
参见例子 一行写两个

Row一行，Col两个即两列总共24

上述选中的可以显示为20页/条

描述一个自己思路转不过来的坑-----

问题描述：

往往optionDatas是一个对象数组，同时，显示的是text，value是一个id之类的值，但是在选中值后，我们某时会需要取得选中的这条数据中的其他值如params，此时，思路需要转坑---value可以改，
value=index , handleChange 时，选中的 params 为 optionDatas[index].params ;

（复杂(或者多个select时）时可以使用 value= index ，此时split(\'-\')可以拿到id和index。）

Dropdown的menu是一个组件时，点击item之后，下拉框并不会自动收起，解决办法，Dropdown和menu写在一个组件中。