Syncfusion AI Assistant

How can I help you?

Show dates of other months in React Calendar component

The following example demonstrates how to show dates from other months.

The styles below make other-month dates visible when they are hidden by default.

.e-calendar .e-content tr.e-month-hide,
.e-calendar .e-content td.e-other-month>span.e-day {
    display: block;
}

.e-calendar .e-content td.e-month-hide,
.e-calendar .e-content td.e-other-month {
    pointer-events: auto;
    touch-action: auto;
}
// import the calendarcomponent
import { CalendarComponent } from '@syncfusion/ej2-react-calendars';
import * as React from "react";
import * as ReactDOM from "react-dom";
export default class App extends React.Component {
    render() {
        return <CalendarComponent id="calendar"/>;
    }
}
;
ReactDOM.render(<App />, document.getElementById('element'));
// import the calendarcomponent
import { CalendarComponent} from '@syncfusion/ej2-react-calendars';
import * as React from "react";
import * as ReactDOM from "react-dom";

export default class App extends React.Component<{}, {}> {
    public render() {
        return <CalendarComponent id="calendar" />
    }
};
ReactDOM.render(<App />, document.getElementById('element'));