日期时间选择器

日期时间选择器允许用户通过下拉面板同时选择日期和时间。

用法

设置默认值

通过 defaultValue 选项设置默认值，设置为 'today' 可以将默认值设置为现在时间。

格式化

通过 format 选项设置日期和时间的格式化形式。

限制日期范围

通过 minDate 和 maxDate 来限制可选的日期范围。

自定义菜单

通过 menu 选项可以在弹出面板左侧显示一个自定义菜单，通过 actions 可以自定义底部工具栏上的按钮。在菜单项和按钮上通过 [data-set-date] 属性指定点击按钮时要设定的日期。

自定义左侧菜单

通过 menu 选项可以在弹出面板左侧显示一个自定义菜单，在菜单项配置上通过 [data-set-date] 属性指定点击菜单项时要设定的日期。

自定义底部按钮

通过 actions 可以自定义底部工具栏上的按钮，在菜单项和按钮上通过 [data-set-date] 属性指定点击按钮时要设定的日期。

选项

名称	类型	默认值	说明
className	any	null	组件根元素的类名。 style?: object; // 组件根元素的样式。 tagName?: string; // 组件根元素的标签名。 attrs?: object; // 附加到组件根元素上的属性。 clickType?: 'toggle' | 'open'; // 点击类型，toggle 表示点击按钮时切换显示隐藏，open 表示点击按钮时只打开。 name?: string; // 作为表单项的名称。 defaultValue?: 'today' | string; // 默认值。 onChange?: function; // 值变更时的回调函数。 disabled?: boolean; // 是否禁用。 readonly?: boolean; // 是否只读，不允许手动修改。 required?: boolean; // 是否必须提供值（不能清除和选择空值）。 placeholder?: string; // 输入框上占位文本。 format?: string; // 日期格式，默认 yyyy-MM-dd。 icon?: string | object; // 在输入框右侧显示的图标。 weekNames?: string[]; // 星期名称，索引为 0 表示周日。 monthNames?: string[]; // 月份名称，索引为 0 表示一月份。 yearText?: string; // 用于显示年份的格式化文本。 todayText?: string; // 用于显示“今天”的文本。 clearText?: string; // 用于显示“清除”的文本。 weekStart?: number; // 一周从星期几开始，默认 1。 minDate?: DateLike; // 最小可选的日期。 maxDate?: DateLike; // 最大可选的日期。 menu?: object[] | object; // 左侧显示的菜单设置。 actions?: object[] | object; // 底部工具栏设置。 onInvalid?: function; // 日期值无效时的回调函数。 minuteStep?: number; // 分钟选择间隔，默认 5（分钟）。