- 🐞 Fix `onFieldsChange` event will still be triggered incorrectly when the field is not configured with `rules` when the Form is submitted. [#43290](https://github.com/ant-design/ant-design/pull/43290)
- 🐞 Fix the problem that the warning message that `name` is empty is falsely reported when the `name` of Form.List is 0. [#43199](https://github.com/ant-design/ant-design/pull/43199) [@Yuiai01](https://github.com/Yuiai01)
- 🐞 Fix the Badge `color` attribute does not take effect. [#43304](https://github.com/ant-design/ant-design/pull/43304)
- 🐞 Fix the position of Select clear icon when FormItem sets `hasFeedback`. [#43302](https://github.com/ant-design/ant-design/pull/43302) [@tinyfind](https://github.com/tinyfind)
- 🐞 Fix Transfer paging drop-down button is hidden and `showSizeChanger` method is invalid. [#41906](https://github.com/ant-design/ant-design/pull/41906) [@Yuiai01](https://github.com/Yuiai01)
- 🐞 Fix the invalid modification of `colorText` and `fontSize` of Popconfirm component. [#43212](https://github.com/ant-design/ant-design/pull/43212) [@MadCcc](https://github.com/MadCcc)
- 🐞 Fix the problem that deleting files after Upload configures `maxCount` will not trigger `onChange`. [#43193](https://github.com/ant-design/ant-design/pull/43193)
- 💄 Fix Button disabled style error when it has `link` or `href` attribute. [#43091](https://github.com/ant-design/ant-design/pull/43091) [@BoyYangzai](https://github.com/BoyYangzai)
- TypeScript
- 🤖 Optimize Breadcrumb `params` type and support generics. [#43211](https://github.com/ant-design/ant-design/pull/43211)
- 🤖 Optimize Breadcrumb `params` type and support generics. [#43257](https://github.com/ant-design/ant-design/pull/43257) [@thinkasany](https://github.com/thinkasany)
- 🤖 Remove redundant number type from Button `loading`. [#43256](https://github.com/ant-design/ant-design/pull/43256) [@thinkasany](https://github.com/thinkasany)
| disabled | Determine whether the DatePicker is disabled | boolean | false | |
| disabled | Determine whether the DatePicker is disabled | boolean | false | |
| disabledDate | Specify the date that cannot be selected | (currentDate: dayjs) => boolean | - | |
| disabledDate | Specify the date that cannot be selected | (currentDate: dayjs) => boolean | - | |
| format | To set the date format, support multi-format matching when it is an array, display the first one shall prevail. refer to [dayjs#format](https://day.js.org/docs/en/display/format). for example: [Custom Format](#components-date-picker-demo-format) | [formatType](#formattype) | [rc-picker](https://github.com/react-component/picker/blob/f512f18ed59d6791280d1c3d7d37abbb9867eb0b/src/utils/uiUtil.ts#L155-L177) | |
| format | To set the date format, support multi-format matching when it is an array, display the first one shall prevail. refer to [dayjs#format](https://day.js.org/docs/en/display/format). for example: [Custom Format](#components-date-picker-demo-format) | [formatType](#formattype) | [rc-picker](https://github.com/react-component/picker/blob/f512f18ed59d6791280d1c3d7d37abbb9867eb0b/src/utils/uiUtil.ts#L155-L177) | |
@ -187,7 +187,7 @@ Added in `4.1.0`.
| --- | --- | --- | --- | --- |
| --- | --- | --- | --- | --- |
| allowEmpty | Allow start or end input leave empty | \[boolean, boolean] | \[false, false] | |
| allowEmpty | Allow start or end input leave empty | \[boolean, boolean] | \[false, false] | |
| dateRender | Custom rendering function for date cells, >= 5.4.0 use `cellRender` instead. | function(currentDate: dayjs, today: dayjs) => React.ReactNode | - | <5.4.0|
| dateRender | Custom rendering function for date cells, >= 5.4.0 use `cellRender` instead. | function(currentDate: dayjs, today: dayjs) => React.ReactNode | - | <5.4.0|
## Use Form's `setFieldsValue` method to report an error if the object type contains `null`
When we try to set the form value using the `setFieldsValue` method in the form instance of the form component, if the passed object contains the type null, such as:
```tsx
// This is not real world code, just for explain
import { Form } from 'antd';
type Test = {
value: string[] | null;
};
export default () => {
const [form] = Form.useForm<Test>();
form.setFieldsValue({
value: null, // Error: Type "null" cannot be assigned to type "string[] | undefined".
});
};
```
If you encounter the above error, please check the current project `tsconfig.json` contains the following configuration:
```json
{
"strictNullChecks": true
}
```
The above problem occurs if `strictNullChecks` is set to `true`, If you can determine the project don't need this configuration (see [strictNullChecks](https://www.typescriptlang.org/zh/tsconfig#strictNullChecks) to judge whether need the configuration). You can try changing to `false` to turn off the control strict check. However, if you do need to enable this feature, you can avoid this situation by using other types instead of `null` when designing types
<videoclass="transition-video-player"alt="example of Adding an Object"description="When an object is added, the highlighted area shows it to the user. The highlight fades in several seconds in order not to interfere the user flow."src="https://os.alipayobjects.com/rmsportal/FqkQMyFqNqielOw.mp4"/>
<videoclass="transition-video-player"alt="example of Adding an Object"description="When an object is added, the highlighted area shows it to the user. The highlight fades in several seconds in order not to interfere the user flow."src="https://os.alipayobjects.com/rmsportal/FqkQMyFqNqielOw.mp4"></video>
Adding an Object: Add an object in the table or chart.
Adding an Object: Add an object in the table or chart.
<br>
<br>
<videoclass="transition-video-player"alt="example of Deleting Objects"src="https://os.alipayobjects.com/rmsportal/pnNkNIMoowmGUQy.mp4"/>
<videoclass="transition-video-player"alt="example of Deleting Objects"src="https://os.alipayobjects.com/rmsportal/pnNkNIMoowmGUQy.mp4"></video>
Deleting an Object: Delete an object in the table or chart.
Deleting an Object: Delete an object in the table or chart.
<br>
<br>
<videoclass="transition-video-player"alt="example of Modifying an object"description="Status No.1: The user modifies the value of Detail. <br>Status No.2: After the user click the save button, a yellow fill is displayed in the grid of Detail, which indicates the change of the object. <br>Status No.3: The fill fades in several seconds and returned to normal."src="https://os.alipayobjects.com/rmsportal/XrUIWmsmOlEnZGc.mp4"/>
<videoclass="transition-video-player"alt="example of Modifying an object"description="Status No.1: The user modifies the value of Detail. <br>Status No.2: After the user click the save button, a yellow fill is displayed in the grid of Detail, which indicates the change of the object. <br>Status No.3: The fill fades in several seconds and returned to normal."src="https://os.alipayobjects.com/rmsportal/XrUIWmsmOlEnZGc.mp4"></video>
Modifying an Object: Modify an object in the table or chart.
Modifying an Object: Modify an object in the table or chart.
<br>
<br>
<videoclass="transition-video-player"alt="example of Calling out an Object"src="https://os.alipayobjects.com/rmsportal/gSNilqbiXOufDXF.mp4"/>
<videoclass="transition-video-player"alt="example of Calling out an Object"src="https://os.alipayobjects.com/rmsportal/gSNilqbiXOufDXF.mp4"></video>
Calling out an Object: Click the page element and call out a new object.
Calling out an Object: Click the page element and call out a new object.
栗嘉男
1 year ago