如何在react-big-calender的当前月份视图中隐藏上个月的日期

Question

我是 react-big-calender 的新手。我想在当前月份的视图中隐藏上个月的日期。有什么办法可以删除以前的日期吗？

我的代码如下。

<Calendar
  // toolbar={false}
  localizer={localizer}
  events={myEventsList}
  startAccessor="start"
  endAccessor="end"
  style={{ height: 800 }}
  eventPropGetter={eventStyleGetter}
  view="month"
/>

活动列表

我已附上图片。

当月活动

const eventLists = [
  {
    "title": "Event 6",
    "start": "2024-02-01T12:00",
    "end": "2024-02-01T13:00"
  },
  {
    "title": "Event 7",
    "start": "2024-02-03T13:00",
    "end": "2024-02-03T14:00"
  },
  {
    "title": "Event 8",
    "start": "2024-02-05T14:00",
    "end": "2024-02-05T15:00"
  },
  {
    "title": "Event 9",
    "start": "2024-02-07T15:00",
    "end": "2024-02-07T16:00"
  },
]

Answer 1

在“月”视图中，当月以外的日期将获得

rbc-off-range

类。要从这些单元格中删除“日期”的显示，您可以应用覆盖类。

.rbc-off-range {
  > a {
    display: none;
  }
}

正如您已经看到的，这仍然会在这些单元格上放置任何

events

，因此您可以通过编程方式删除它们。