4

我们使用 react-datepicker 来实现我们的日历。显示的默认月份由monthsShown控制组件属性控制。当我们说 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

2 回答 2

3

是的，可以显示当月和上月的组合。

尝试提供这两个值：

showPreviousMonths = true 和 monthsShown = 2

<DatePicker
  selected={startDate}
  showPreviousMonths
  onChange={date => setStartDate(date)}
  monthsShown={2}
/>

https://reactdatepicker.com/#example-show-previous-months

于 2020-12-08T06:23:31.267 回答
3

不幸的是，查看react-datepickerrepo 中组件的源代码，它似乎总是显示当前月份和之后的几个月，由monthsShown 属性控制。除了分叉 github repo 并自己添加功能（或提交功能请求）之外，不要认为有其他方法可以让它做你想做的事情。有问题的问题：

日历.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。为了让它做你想做的事情，可以添加一个标志来反转月份的加法并改为减去它。

于 2019-04-04T22:08:54.300 回答