Ant Design

Table of Contents

antd v4 发布了,以下如无特殊说明,均为 3.x 版本。

1 FAQ

1.1 表格内嵌表格,无数据时不显示 icon

function expandIcon({ expanded, expandable, record, onExpand }) {
  if (!expandable || record.canExpanded === false) return null;

  return (
    <a onClick={e => onExpand(record, e)}>
      {expanded ? <Icon type="minus-square" /> : <Icon type="plus-square" />}
    </a>
    );
}

https://codesandbox.io/s/8x2j898pp2

1.2 表格水平滚动条,显示时多了一个空白列

  1. 列设置固定宽度,比如 width: 980 ,注意是数值不是字符串
  2. 设置 scroll,比如 scroll={{ x: 1600 }} x 的值对应的屏幕的大小,1600 的意思是超过 1600 宽度的屏幕才开始滚动。 另外 x 可以设置成 max-content 来自适应滚动1

1.3 表单 required 校验时,提示 "xxx is not string"

如果设置了 required: true ,会校验值是否有效,但是默认似乎是 string 类型,如果值不是 string 类型,需要手动设置值类型 type

type 可选值有:https://github.com/yiminghe/async-validator#type

比如:

rules: [{ require: true, type: 'integer' }]

1.4 v4 form initialValue 只初始化一次

官方说明:

在 v3 版本中,修改未操作的字段 initialValue 会同步更新字段值,这是一个 BUG。但是由于被长期作为一个 feature 使用, 因而我们一直没有修复。在 v4 中,该 BUG 已被修复。initialValue 只有在初始化以及重置表单时生效。

这会导致类似编辑的表单老的办法没法使用了,表单字段只能初始化一次,数据不更新。解决办法:

2 资源

Footnotes:

First created: 2019-12-10 18:01:01
Last updated: 2020-09-09 Wed 14:29
Power by Emacs 26.3 (Org mode 9.4)