Question

我想使用反应日历（https://www.npmjs.com/package/react-calendar）显示多个日期。问题在于日历选择了之间的所有日期，而不是单独选择每个日期。

例如，我有两个日期2019年6月4日和2019年6月9日。日历只应选择4号和9号，但也应选择5号，6号，7号和8号。我只想选择6月4日和6月9日。我附上了一个我想使用react-dates DayPickerSingleDateController实现的示例。可以使用react-calendar来实现相同的事情吗？

<Calendar
  value={[new Date(2019, 5, 4), new Date(2019, 5, 9)]}
/>

First Image

我希望日历仅显示这2个日期，而不显示日期之间。

Second Image

Answer 1

这将有助于：

import React, { Component } from 'react';
import Calendar from 'react-calendar';

class MyApp extends Component {
  state = {
    date: new Date(),
  }

  onChange = date => this.setState({ date })

  render() {
    return (
      <div>
        <Calendar
          onChange={this.onChange}
          value={this.state.date}
          selectRange={true}
        />
      </div>
    );
  }
}

selectRange将帮助您实现目标。这是source.

在React Calendar上显示多个日期

1 个答案: