DatePicker日期选择框
DatePicker
日期选择框
输入或选择日期的控件。
使用import{ DatePicker }from"antd"; |
- 组件总览
- 通用
- 布局
- 导航
- 数据录入
- 数据展示
- 反馈
- 其他
当用户需要输入一个日期，可以点击标准输入框，弹出日期面板进行选择。
最简单的用法，在浮层中可以选择或者输入日期。
多选，不支持 showTime 以及 picker="time"。
DatePicker 默认会根据 picker 的交互行为，自动选择是否需要确认按钮。你也可以通过 needConfirm 属性来手动设置是否需要确认按钮。当有 needConfirm 时，用户始终需要点击确认按钮才能完成选择。反之，则会在选择或者失去焦点时提交。
使用 format 属性，可以自定义日期显示格式。当 format 为数组时，选择器输入框可以输入数组中任意一个有效格式。
输入格式对齐，通过键盘左右切换焦点。失去焦点时会尝试对齐到最后合法的日期。
选择框的不可用状态。你也可以通过数组单独禁用 RangePicker 的其中一项。
在范围选择时，可以允许留空。这对于需要保留“至今”日期项颇为有用。
可以预设常用的日期范围以提高用户体验。自 5.8.0 开始，preset value 支持回调函数返回值方式。
三种大小的输入框，若不设置，则为 middle。
通过 components 替换对应面板。
使用 status 为 DatePicker 添加状态，可选 error 或者 warning。
Filled Debug
通过组合 mode 与 onPanelChange 控制要展示的面板。
自定义前缀 prefix 和后缀图标 suffixIcon。
Component Token Debug.
通过设置 picker 属性，指定范围选择器类型。
非响应式间距测试。
提供选择器，自由切换不同类型的日期选择器，常用于日期筛选场合。
增加选择时间功能，当 showTime 为一个对象时，其属性会传递给内建的 TimePicker。
通过 minDate 和 maxDate 限定日期范围。
可用 disabledDate 和 disabledTime 分别禁止选择部分日期和时间，其中 disabledTime 需要和 showTime 一起使用。
使用 disabledDate 的 info.from 来限制动态的日期区间选择。
在浮层中加入额外的页脚，以满足某些定制信息的需求。
使用 cellRender 可以自定义单元格的内容和样式。
通过 locale 配置支持特殊的年历格式。
可选 outlined filled borderless 三种形态。
可以通过 placement 手动指定弹出的位置。
