@beisen-phoenix/date-picker

| 参数 | 说明 | 类型 | 默认值 | | --- | --- | --- | --- | | extraCls | 根节点的自定义className,一般用来自定义样式使用 | string | | | lang | 面板语言`zhCN/zhTW/enUS`,可以通过此参数来设置组件的国际化 | string | 'zhCN' | | locale | 自定义面板的语言信息,该参数的优先级高于lang | object | - | | format | 设置日期格式,为数组时支持多格式匹配,展示以

Usage no npm install needed!

<script type="module">
  import beisenPhoenixDatePicker from 'https://cdn.skypack.dev/@beisen-phoenix/date-picker';
</script>

README

DatePicker 参数

参数 说明 类型 默认值
extraCls 根节点的自定义className,一般用来自定义样式使用 string
lang 面板语言zhCN/zhTW/enUS,可以通过此参数来设置组件的国际化 string 'zhCN'
locale 自定义面板的语言信息,该参数的优先级高于lang object -
format 设置日期格式,为数组时支持多格式匹配,展示以第一个为准。配置参考 moment.js string | string[] "YYYY-MM-DD"
value 日期 string 或moment (http://momentjs.com/) 受控模式下使用
defaultValue 日期 string 或moment (http://momentjs.com/) 非受控模式下使用
showDateInput 是否显示日期输入框 Boolean true
showWeekNumber 是否展示第几周 boolean true
showToday 是否展示“今天”按钮 boolean true
showOk 是否展示“确定”按钮 boolean true
dateInputPlaceholder 输入框提示文字 string 请输入日期
dateRender 自定义日期单元格的内容 function(currentDate: moment, value: moment) => React.ReactNode -
renderSidebar 在面板中添加额外的页头 (mode) => React.Node -
renderFooter 在面板中添加额外的页脚 (mode) => React.Node -
disabledDate 不可选择的日期 (currentDate: moment) => boolean
onSelect 选择日期变化时的回调 function(date: moment)
onClear 日期清空时的回调 function()
onChange 内部日期变化时的回调(前后一个月,前后一年等) function(date: moment)
onPanelChange 日历面板切换的回调 function(value, mode) -
onOk 点击确定按钮的回调 function(date: moment) -
clearIcon 自定义的清除图标 () => React.ReactNode

DateRangePicker 参数

参数 说明 类型 默认值 版本
extraCls 根节点的自定义className,一般用来自定义样式使用 string
lang 面板语言 zhCN/zhTW/enUS 'zhCN'
locale 自定义面板的语言信息,该参数的优先级高于lang object -
format 设置日期格式 Moment[] string[]
value 日期 Moment[] string[]
defaultValue 日期 Moment[] string[]
showDateInput 是否显示日期输入框 Boolean true
showWeekNumber 是否展示第几周 boolean true
showToday 是否展示“今天”按钮 boolean true
showOk 是否展示“确定”按钮 boolean true
dateInputPlaceholder 输入框提示文字 string/string[] 请输入日期
showClear 是否显示清除按钮,当输入框中有值且该参数为true时显示清除按钮 boolean true
disabledDate 不可选择的日期 (currentDate: moment) => boolean
renderSidebar 在面板中添加额外的页头 (mode) => React.Node -
renderFooter 在面板中添加额外的页脚 (mode) => React.Node -
onClear 日期清空时的回调 function()
onSelect 选择日期变化时的回调 function(date: moment[])
onOk 点击确定按钮的回调 function(date: moment) -
onChange 内部日期变化时的回调(前后一个月,前后一年等) function(date: moment[])
onPanelChange 日历面板切换的回调 function(value:moment[], mode) -
clearIcon 自定义的清除图标 () => React.ReactNode

MonthPicker 参数

参数 说明 类型 默认值 版本
extraCls 根节点的自定义className,一般用来自定义样式使用 string
lang 面板语言 zhCN/zhTW/enUS 'zhCN'
locale 自定义面板的语言信息,该参数的优先级高于lang object -
value 日期 string 或moment (http://momentjs.com/) 受控模式下使用
defaultValue 日期 string 或moment (http://momentjs.com/) 非受控模式下使用
disabledDate 不可选择的日期 (currentDate: moment) => boolean
renderFooter 在面板中添加额外的页脚 (mode) => React.Node -
onChange 内部日期变化时的回调(前后一个月,前后一年等) function(date: moment)
onSelect 选择日期变化时的回调 function(date: moment)