reactjs - 反应大日历从时隙隐藏开始时间结束时间

Question

我有一个反应大日历，如下图所示，我想删除带圆圈的时间/结束时间：

使用以下参数呈现反应大日历：

<BigCalendar
                selectable
                events={this.props.events?this.props.events:[]}
                views={{ week:MyWeek}}
                defaultView='week'
                defaultDate={this.state.date?this.state.date:new Date()}
                date={this.state.date?this.state.date:new Date()}
                now={new Date(0)}
                min={new Date(this.state.today.getFullYear(), this.state.today.getMonth(), this.state.today.getDate(), 8)}
                max={new Date(this.state.today.getFullYear(), this.state.today.getMonth(), this.state.today.getDate(), 20)}
                onSelectSlot={(slotInfo) => {this.props.onSelectSlot('interview', slotInfo, 'add'); store.dispatch(addBreadcrumb({name: B_PREPARATION_INTERVIEW}));}}
                onSelectEvent={event => {this.props.onSelectEvent('interview', event); store.dispatch(addBreadcrumb({name: B_PREPARATION_INTERVIEW}));} }
                onNavigate={(date) => this.changeDate(date)}
                components={{event: Event }}
                eventPropGetter={(this.eventStyleGetter)}
                titleAccessor={function(e) {console.log("aaaaaaaaaaa"); console.log(e); return e.title;}}
            />

我尝试添加 titleAccessor 以删除开始时间/结束时间，但没有结果。

Answer 1

您可以像这样覆盖 CSS 类rbc-event-label：

.rbc-event-label {
  display: none;
}

隐藏开始和结束时间。

Answer 2

在format.eventTimeRangeFormat返回 null 时，这不会显示时间标签。

检查文档

Answer 3

按照文档中的格式部分：

const formats = {
    eventTimeRangeFormat: () => { 
      return "";
    },
  };

<Calendar formats={formats} />