#header-mark#
DataTimePicker 日期时间选择器
在同一个选择器里选择日期和时间
TIP
日期时间选择器来自日期选择器和时间选择器的组合。 关于属性的更详细解释,请参阅日期选择器和时间选择器。
::: top 有关 DateTimePicker 组件支持的浏览器列表,请参阅 MDN。对于不支持的浏览器,会尝试回退到单独的日期和时间输入。 :::
基本用法
在同一个选择器里同时进行日期和时间的选择。
v-model
的值为 datetime.datetime
类型。
限制时间选择范围
可以限制时间选择范围。
通过 min
和 max
限制可选时间范围。
禁用状态
你可以使用 disabled
属性来定义是否被禁用。
使用 disabled
属性来控制是否为禁用状态。该属性接受一个 bool
类型的值。
自定义样式
您可以自定义输入框样式。
使用 style
属性额外配置样式:
description-width
:label的宽度。
DateTimePicker API
DateTimePicker 属性
属性名 | 说明 | 类型 | 默认值 |
---|---|---|---|
v-model/value | 绑定值 | datetime.datetime | — |
label | 标签文字 | str | — |
min | 允许选择的最小时间 | datetime.datetime | — |
max | 允许选择的最大时间 | datetime.datetime | — |
step | 时间选择器的步长 | float | — |
disabled | 按钮是否为禁用状态 | boolean | false |
style | 自定义css样式 | str | - |
TIP
style 支持的其它css属性
Sizes相关
- height
- width
- max_height
- max_width
- min_height
- min_width
Display相关
- visibility
- display
- overflow
Box model相关
- border
- margin
- padding
Positioning相关
- top
- left
- bottom
- right
DateTimePicker 方法
属性名 | 说明 | 类型 |
---|
src/examples/ipywui/component/datetime-picker