Antd日历更改逐月单元格单击

时间:2019-02-09 22:23:38

标签: javascript reactjs calendar frameworks antd

如果您使用“ antd”中的“日历”组件,那么您提到过,当您单击上个月/下个月的日期时,它将自动更改月份。

如何防止这种行为? https://ant.design/components/calendar/#header

1 个答案:

答案 0 :(得分:0)

1.禁用日期

您可以禁用不在当月的日期。这应该可以防止点击它们。

<Calendar value={selectedDate} disabledDate={disabledDate} />
disabledDate = currentDate => {
  return currentDate.isSame(this.selectedDate, 'month'))
};

2.防止选择

如果您想要更多控制。您可以使用 onSelect 检查当前所选日期是否在当月中手动设置值。

<Calendar value={selectedDate} onSelect={this.onSelect} />
onSelect = date => {
  if (date.isSame(this.selectedDate, 'month')) {
    this.setState({
      selectedDate: date,
    });
  }
};

注意