关于前端:Ant-Design-RangePicker-日期选择器不可选择今日或以后的日期-最多可以选择31天

首先先看看成果:效果图: 默认是始终不可抉择今日和当前的日期

当抉择了一个日期后, 将它的可抉择区间限度在 31 天内, 并且下次抉择时解除限制

上面是代码示例, 外面的 props, state, this.setState 视状况自行批改

<RangePickerstyle={{ marginRight: 8 }}placeholder={[t('startDate'), t('endDate')]}disabledDate={props.disabledDate}onChange={dates => props.rangeOnChange(dates)}  onCalendarChange={dates => props.CalendarChange(dates)}  defaultValue={[props.begin,props.end]}  />  disabledDate = (current) =>  {    // current && (moment(current).format('YYYY-MM-DD') === moment().format('YYYY-MM-DD')     //              || current > moment().endOf('day'))    // 这一段是限度不可选今日和当前的日期, 看需要进行批改    // this.state.TimeInterval).subtract(30, 'd') 中的 30 看需要是限度多少天内自行批改    // moment(this.state.TimeInterval).add(30, 'd') 同理    return this.state.TimeInterval ?       parseInt(moment(moment(current).format('YYYY-MM-DD')).format('x')) < parseInt(moment(moment(this.state.TimeInterval).subtract(30, 'd').format('YYYY-MM-DD')).format('x')) ||       parseInt(moment(moment(current).format('YYYY-MM-DD')).format('x')) > parseInt(moment(moment(this.state.TimeInterval).add(30, 'd').format('YYYY-MM-DD')).format('x')) ||       current && (moment(current).format('YYYY-MM-DD') === moment().format('YYYY-MM-DD') ||                   current > moment().endOf('day'))      :       current && (moment(current).format('YYYY-MM-DD') === moment().format('YYYY-MM-DD')                   || current > moment().endOf('day'))    // 前面的是解除区间限度后的规定, 设置为 flase 示意容许  }async rangeOnChange(value) {  // this.begin = value.length !== 0 ? value[0].unix() : '';  // this.end = value.length !== 0 ? value[1].unix() : '';  // 这里是将开始当天的零点工夫戳和完结当天23.59.59的工夫戳以秒的形式赋值. 依据后端要求传值即可  this.begin = value.length !== 0 ? parseInt(moment(value[0].format("YYYY-MM-DD")).startOf('day').format('x') / 1000) : '';  this.end = value.length !== 0 ? parseInt(moment(value[1].format("YYYY-MM-DD")).endOf('day').format('x') / 1000) : '';  await // 日期查问相干的业务代码, 此处省略}CalendarChange = (value) => {  // 这里进行判断, 当日期的区间抉择实现之后解除区间限度             this.setState({ TimeInterval: value.length > 1 ? null :value[0] })         }