@alicd/crui-date-range-picker-field

---

category: Components type: UI Views component: Form chinese: 日期区间选择器 english: DateRangePickerField

地址多选组件。

API

DateRangePickerField

成员	说明	类型	默认值
className	自定义组件样式类名	string	N/A
size	输入框大小 可选值: 'small', 'medium', 'large'	"small" 或 "medium" 或 "large"	"medium"
value	日期值	[Date, Date]	N/A
defaultValue	默认日期值	[Date, Date]	N/A
onChange	时间发生改变的回调	(dateRange: [Date, Date], formatDateRange: [string, string]) => any	N/A
disabledDate	日期禁用 签名: Function(CalendarObject: Object) => Boolean 参数: CalendarObject: {Object} null 返回值: {Boolean} true 表示禁用，反之表示可用	Function	() => false
disabledHours	禁用指定的小时，同 TimePicker	Function	N/A
disabledMinutes	禁用指定的分钟，同 TimePicker	Function	N/A
disabledSeconds	禁用指定的秒钟，同 TimePicker	Function	N/A
defaultVisible	默认是否展开	boolean	N/A
visible	是否展开	boolean	N/A
onVisibleChange	当面板展开状态改变时的回调	(visible: boolean) => void	N/A
popupStyle	弹层样式	object	N/A
popupAlign	弹层对齐方式	string	"tl tl"
popupOffset	弹层偏移	[number, number]	[0, 0]
formater	日期值格式化	[string, string]	["YYYY-MM-DD", "HH:mm:ss"]
disabled	是否禁用	boolean	false
startDisabled	是否单独禁用开始时间选框	boolean	false
endDisabled	是否单独禁用结束时间选框	boolean	false
hasClear	是否有清空按钮	boolean	true
showTime	是否显示时间或传入 { defaultValue } 设置时间初值	boolean 或 { defaultValue: string } 或 { defaultValue: [string, string] }	false
resetTime	重新选择时是否重置时间	boolean	true
readOnly	输入框是否只读	boolean	false
renderQuickTool	用于自定义弹层下方的工具栏，可配合 ranges 等工具函数使用	(ops: { setValue; getValue; setVisible }) => ReactNode	N/A

DateRangePickerField.ranges

类型：

       (src: [ReactNode, [Date, Date]])
    => (ops: {
        setValue:   (value: [Date, Date]) => void;
        getValue:   () => [Date, Date];
        setVisible: (visible: boolean): void;
    })
    => ReactNode

指定在 DateRangePickerField 的 renderQuickTool 上，用于自定义预设的快捷选择日期范围。