如何在反应大日历单元格中显示文本/按钮？

Question

我能够通过 slotPropGetter 道具编辑周视图槽样式，但找不到在没有事件时如何将文本传递到槽的解决方案。图片上的示例。

当前表：

<BigCalendar
  selectable
  className="calendar"
  popup
  localizer={localizer}
  formats={formats}
  events={this.state.events}
  defaultView={BigCalendar.Views.WEEK}
  views={['week']}
  step={90}
  timeslots={1}
  min={new Date(2019, 0, 1, 8, 0)} // 8.00 AM
  max={new Date(2020, 0, 1, 22, 0)} // Max will be 6.00 PM!
  onSelectEvent={event => this.showModalHandler(event, false, true)}
  onSelectSlot={event => this.showModalHandler(event, true, false)}
  eventPropGetter={this.eventStyleHandler}
  slotPropGetter={this.slotStyleHandler}
  components={{
      event: this.CustomEvent,
      week: {
          header: CustomDateHeader,
      },
  }}

/>

也许使用 timeSlotWrapper？以某种方式在 timeSlopWrapperProps.children 中更改内容？

const timeSlotWrapper = timeSlotWrapperProps => {
    return timeSlotWrapperProps.children
}

沙盒游戏：https://codesandbox.io/embed/react-big-calendar-example-s6lsl?fontsize=14&hidenavigation=1&theme=dark

React 大日历 api 文档：http://jquense.github.io/react-big-calendar/examples/index.html#api

Answer 1

解决方案是为每个单元格创建事件并修改事件样式，而不是尝试修改空单元格样式。