Javascript 当我在react full calendar中的日历外聚焦时，无法突出显示所选内容

我用的是全日历

我希望即使在我单击日历外的日期（即此处的地图）时，也能突出显示所选日期。我还想在单击时突出显示我的自定义事件，即cropname。我还附上了我的jsx

有人能帮我吗

JSX=>

render（）{ 返回(

{this.onDateSelection（e）}
插件={[dayGridPlugin，interactionPlugin]}
周末={true}
可选=“真”
取消选择={（e）=>e.jsEvent.preventDefault（）}
contentHeight=“自动”
showNonCurrentDates=“false”
events={this.state.calendarEvents&&this.state.calendarEvents.list}
//viewRender={（视图，元素）=>{alert（“render”）；console.log（视图，元素）}
viewSkeletonRender={info=>{this.addPaginationEvent（）；}}
eventRender={（{event，el}）=>{
常量内容=
e、 preventDefault（）}>
this.onCropSelect（event.\u def.extendedProps，e）}>{event.\u def.extendedProps.cropName}
this.onCropSelect（event.\u def.extendedProps，e）}>{event.\u def.extendedProps.cropQuantity+event.\u def.extendedProps.cropQuantityUnit}
;
ReactDOM.render（内容，el）；
返回el；
}
}
/>
)

---

}

我尝试取消选择，例如，prevent default（）在那里甚至不起作用。请将代码作为字符而不是图像发布。请。代码为文本，请以文本形式提供。复制和粘贴的时间应该少于创建和上传截图的时间@ADyson我已经附上了代码。如果有人能帮我找到解决方案，那就太好了。谢谢。好啊那么，你试过使用吗？或者你试过设置为false吗？根据您的具体要求，其中任何一个都可能对您有用。我尝试取消选择，例如，prevent default（）在那里甚至不起作用。请将代码作为字符而不是图像发布。请。代码为文本，请以文本形式提供。复制和粘贴的时间应该少于创建和上传截图的时间@ADyson我已经附上了代码。如果有人能帮我找到解决方案，那就太好了。谢谢。好啊那么，你试过使用吗？或者你试过设置为false吗？根据您的具体需求，其中任何一个都可能对您有用。

  <FullCalendar
    dafaultView="dayGridMonth"
    // defaultDate= '2017-12-12'
    eventLimit="true"
    eventLimitText="More"
    views={{
      month: {
        eventLimit: 3
      }
    }}
    dateClick={(e) => { this.onDateSelection(e) }}
    plugins={[dayGridPlugin, interactionPlugin]}
    weekends={true}
    selectable="true"
    unselect={(e)=>e.jsEvent.preventDefault()}
    contentHeight="auto"
    showNonCurrentDates="false"
    events={this.state.calendarEvents && this.state.calendarEvents.list}
    // viewRender={(view, element) => { alert("render"); console.log(view, element) }}
    viewSkeletonRender={info => { this.addPaginationEvent(); }}
    eventRender={({ event, el }) => {
      const content = <div className="eventDetailContainer eventColor row justify-content-around">
        <div id="eventDetailImg"className="col-md-1" onClick={(e) => e.preventDefault()}>
          <img onClick={(e) => this.onCropSelect(event._def.extendedProps,e)} src={CropImageFinder(event._def.extendedProps.cropName)} />
        </div>
        <div className="col-md-5 harvestEventCropName harvestEventCropNameHideMobile">
          <span onClick={(e) => this.onCropSelect(event._def.extendedProps,e)} > {event._def.extendedProps.cropName} </span>
        </div>
        <div id="eventDetailQuantity"className="col-md-2 harvestEventCropName">
          <span onClick={(e) => this.onCropSelect(event._def.extendedProps,e)} > {event._def.extendedProps.cropQuantity + event._def.extendedProps.cropQuantityUnit } </span>
        </div>
      </div>;
      ReactDOM.render(content, el);
      return el;
    }
    }
  />
</section>)