DatePicker 設(shè)置value,disabledDate 今天之后(包括今天)不可選失效

如圖:當(dāng)前日期:9號(hào);

初始值不可選,點(diǎn)了一個(gè) 8號(hào)之后,9號(hào)就可以選擇了
image.png

正確應(yīng)該是這樣?jì)饍旱模?div id="u0z1t8os" class="image-package">
image.png
import React, { useState } from 'react';
import 'antd/dist/antd.css';
import { DatePicker, Space } from 'antd';
import type { RangePickerProps } from 'antd/es/date-picker';
import moment from 'moment';

const { RangePicker } = DatePicker;

const App = () => {
  const [valueDate, setvalueDate] = useState('');

  const onChange = (e) => {
    console.log(moment(e).format('YYYY-MM-DD'), 'kjk');
    setvalueDate(moment(e).format('YYYY-MM-DD'));
  };

  const onChanges = (e) => {
    setvalueDate('');
  };

  const disabledDate: RangePickerProps['disabledDate'] = (current) => {
    return current && current > moment().startOf('day');
  };

  const disabledDate1: RangePickerProps['disabledDate'] = (current) => {
    return current && current > moment().subtract(1, 'days').endOf('day');
  };

  return (
    <Space direction="vertical" size={12}>
      錯(cuò)誤方式:
      <DatePicker
        disabledDate={disabledDate}
        value={valueDate ? moment(valueDate, 'YYYY-MM-DD') : null}
        onChange={onChange}
      />
      <br />
      正確方式:
      <DatePicker disabledDate={disabledDate1} onChange={onChanges} />
    </Space>
  );
};

export default App;

擴(kuò)展

// 當(dāng)天之前的日期不可選
const disabledDate = (current) => {
  return current && current < moment().subtract(1, 'days'); //當(dāng)天之前的不可選,不包括當(dāng)天
  //return current && current < moment().endOf('day');當(dāng)天之前的不可選,包括當(dāng)天
};

// 當(dāng)天之后的日期不可選
const disabledDate = (current) => {
  return current.getTime() > Date.now();
};

// 限制只能選今天及之前的日期(今天可選中)
const disabledDate = (current) => {
  return current && current > moment().endOf('day');
};

// 限制只能選昨天及之前的日期(今天不可選中)
const disabledDate = (current) => {
  return current && current > moment().subtract(1, 'days').endOf('day');
};

// 當(dāng)天日期不許被選擇,雙休不能被選擇
const disableDate = (date) => {
  return (
    (date && date < moment().endOf('day')) ||
    date.isWeekday() == 6 ||
    date.isWeekday() == 7
  );
};


今夜MVP??????

限制只能選昨天及之前的日期(今天不可選中)
current && current > moment().subtract(1, 'days').endOf('day');

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容