@yizhou-library/rangedatepicker v1.0.3

日期区间选择器

@317hu/rangedatepicker 用于日历开始和结束日期、时间的按区间选择输入，其中时间部分可配置为是否显示。

代码演示

:::demo 基础使用，配置可选择开始|结束的日期和时间，条件限制：结束日期、结束时间（同一天以内）都不能早于开始时间。

render() {
  const nowTime = moment(new Date()).format('HH:mm');
  return (
    <div className="markdown-inner">
      <RangeDatePicker
        disabledTime={() => {}}
        showTime={{
          defaultValue: [moment(nowTime, 'HH:mm'), moment('23:59', 'HH:mm')],
          format: 'HH:mm',
        }}
        placeholder={['开始时间', '结束时间']}
        format="YYYY-MM-DD HH:mm"
        onChange={() => {}}
        disabledDateTimeNow
      />
    </div>
  )
}

:::

:::demo 设置今天以前的日期，为不可选。

render() {
  const nowTime = moment(new Date()).format('HH:mm');
  return (
    <div className="markdown-inner">
      <RangeDatePicker
        disabledTime={() => {}}
        showTime={false}
        placeholder={['开始时间', '结束时间']}
        format="YYYY-MM-DD HH:mm"
        disabledDate={(current) => {// disabledDate: (current: moment.Moment) => boolean; 是函数 且需要返回
          return current && moment(current).format('YYYY-MM-DD') < moment(new Date()).format('YYYY-MM-DD');
        }}
        onChange={() => {}}
      />
    </div>
  )
}

:::

:::demo 设置日期，不显示时间设置。

constructor(props) {
  super(props)
  this.state = {}
}

render() {
  const nowTime = moment(new Date()).format('HH:mm');
  return (
    <div className="markdown-inner">
      <RangeDatePicker
        disabledTime={() => {}}
        showTime={false}
        placeholder={['开始日期', '结束日期']}
        format="YYYY-MM-DD"
        disabledDate={(current) => {// disabledDate: (current: moment.Moment) => boolean; 是函数 且需要返回
          return current && moment(current).format('YYYY-MM-DD') < moment(new Date()).format('YYYY-MM-DD');
        }}
        onChange={() => {}}
      />
    </div>
  )
}

:::

API