Search code examples
reactjsantd

Prevent default select of current day with Ant Calendar

I'm trying to create custom Calendar based on Ant Calendar. Ant Calendar adds class '.ant-fullcalendar-selected-day' by default for current day, but how to avoid it?

https://codesandbox.io/s/r809w9

I need to prevent adding class '.ant-fullcalendar-selected-day' for the first render.

Of course, I could override styles something like this:

.ant-fullcalendar-selected-day .ant-fullcalendar-value {
  color: unset;
  background: unset;
}

But I'll not be able to use selecting days after that anymore

Solution

  • Ok, I've found this easy solution after investigation

      useEffect(() => {
    const selectedDay = document.querySelector('.ant-fullcalendar-selected-day')
    if (selectedDay) {
      selectedDay.classList.remove('ant-fullcalendar-selected-day')
    }
  }, [])