Skip to content

DatePicker 日期选择器

日期选择器,支持单日期、日期范围、月份与日期时间四种类型,键盘可操作,Intl.DateTimeFormat 格式化。

基础选择

基础用法(type=date)

点击输入框展开日期面板,点击日期选中并关闭。

日期范围

日期范围(type=daterange)

双月网格,先选起点再选终点,提交 JSON 数组 ["start","end"];悬停可预览区间。

月份选择

月份(type=month)

日期时间

日期时间(type=datetime)

选择日期与时分秒后点击「确定」提交。

禁用范围

min / max 限制

越界日期不可选。

自定义格式

format 自定义

format 支持 yyyy/MM/dd/HH/mm/ss token。

受控与事件

受控 + oas-change 事件

禁用

禁用(disabled)

API

属性

属性说明类型默认值
disabled禁用boolean
format展示格式 token(yyyy/MM/dd/HH/mm/ssstring
max可选范围(ISO 日期)string
min可选范围(ISO 日期)string
placeholder占位提示
type类型:date / daterange / month / datetimestringdate
value当前值:yyyy-MM-dd / yyyy-MM / yyyy-MM-ddTHH:mm:ss / JSON 范围数组string

事件

事件说明
oas-change值变化,detail: { value }(daterange 为字符串数组)

键盘:Enter / 展开,/// 在网格内移动,Enter 选中,Esc 关闭。