Search code examples
reactjsreact-big-calendar

react big calendar start week from monday instead of sunday?


use react-big-calendar.js and moment.js

setLocalizer code

moment.locale('ko');
BigCalendar.setLocalizer(
  BigCalendar.momentLocalizer(moment)
);

first day of the week is always Sunday

I want to see it from Monday.

The associated url.

https://github.com/intljusticemission/react-big-calendar/issues/28

But there is no example.

what should I do?


find answer

moment.locale('ko',{
  week:{
    dow : 1
  }
});

http://momentjs.com/docs/#/i18n/changing-locale/


Solution

  • I also wanted to change react-big-calendar first day of week to Monday.
    Thank you for your question, because it helped me to find a way of changing it.
    Try the following code snippet is from my project:

    moment.locale('ko', {
        week: {
            dow: 1,
            doy: 1,
        },
    });
    
    BigCalendar.momentLocalizer(moment);
    

    So the full extract looks something like:

    import moment from 'moment';
    import BigCalendar from 'react-big-calendar';
    
    moment.locale('ko', {
        week: {
            dow: 1,
            doy: 1,
        },
    });
    BigCalendar.momentLocalizer(moment);
    
    const Main = (props) => <BigCalendar
        events={props.events}
        startAccessor={'start'}
        endAccessor={'end'}
        titleAccessor={'title'}
        allDayAccessor={'allDay'}
        onNavigate={props.onNavigate}
    />;
    

    Hope that helps.