react-datepicker,默认情况下与monthsShown有关

问题描述 投票:3回答:1

我们正在使用react-datepicker进行日历实现。显示的默认月份由monthsShown datepicker组件属性控制。当我们说2-它显示当前月+下个月。

我正在使用reat DatePicker,如下所示

<DatePicker 
  customInput={<CustomInput disableDateSelection={this.props.dateProps.disableDateSelection} />}
  className="w-dtsr-date-picker"
  selected={this.state.startDate}  //called when the date is clicked 
  onChange={this.handleChange}    //called only when the value is chnaged 
  monthsShown={2}     //number of months to be shown 
  minDate={this.props.dateProps.minDate}  //min days to be shown in the calendar 
  maxDate={this.props.dateProps.maxDate}  //max days to be shown in the calendar 
  onChangeRaw={this.handleDateChangeRaw}  //preventing the user from manually entering the dates or text in the input text box 
  dayClassName={date => date.getTime() === new Date(this.props.dateProps.defaultDate).getTime() && this.props.dateProps.disableDefaultDate ? 'random' : undefined}
  //dayClassName - to disable the proposed forecast dates or actual dates if user has already selected/proposed the same forecast/actual dates
  disabled={this.props.dateProps.disableDateSelection}
/>

有没有办法显示上个月和本月。?例如,如果当前月份是4月份,我们希望显示3月和4月而不是4月 - 5月。

javascript reactjs react-native react-redux react-datepicker
1个回答
2
投票

不幸的是,看看react-datepicker repo中组件的源代码,似乎它总是会显示当前月份和之后的几个月,由monthsShown属性控制。不要认为除了分配github repo并自己添加功能(或提交功能请求)之外,还有办法让它做你想做的事。有问题的问题:

calendar.jsx

var monthList = [];
for (var i = 0; i < this.props.monthsShown; ++i) {
  var monthsToAdd = i - this.props.monthSelectedIn;
  var monthDate = addMonths(this.state.date, monthsToAdd);
  var monthKey = `month-${i}`;

monthsShown属性控制显示的月份,默认为1.为了使它能够执行您想要的操作,可以添加一个标志来反转添加月份并将其减去。

© www.soinside.com 2019 - 2024. All rights reserved.