reactjsfullcalendarmomentjsculturereact-big-calendar

How to change all react-big-calendar to French?


I try to add culture='fr' on the BigCalendar but, I get an error.

My code is:

   import moment from "moment";
    BigCalendar.momentLocalizer(moment);

        export default class Agenda extends Component {
    constructor(props){
        super(props);
        this.state = {
          events: [
            {
              title: 'Calendar 1',
              start: new Date(2019, 2, 19, 15, 0, 0), //03:00 PM
              end: new Date(2019, 2, 19, 16, 30, 0), //04:30 PM
            },
            {
              title: 'Calendar 2 ',
              start: new Date(2019, 2, 20, 12, 30, 0), //08:30 AM
              end: new Date(2019, 2, 20, 18, 0, 0), //18:00 PM      
            },
            {
              title: 'Calendar 3 ',
              start: new Date(2019, 2, 22, 10, 30, 0), //10:30 AM
              end: new Date(2019, 2, 22, 19, 0, 0), //07:00 PM      
            },
            {
              title: 'Calendar 4 ',
              start: new Date(2019, 2, 23, 7, 30, 0), //08:30 AM
              end: new Date(2019, 2, 23, 11, 0, 0), //11:00 AM      
            },
          ],
    }


render() {
     return (
    <div>
     <BigCalendar
                selectable
                events={this.state.events}
                defaultDate={new Date(2019, 2, 19)}
                defaultView="week"
                culture = 'fr'
                style={{ height: "100vh" }}
              />
    </div>
    )
    }
    };

When I run it, I get : enter image description here

How can I fix that ?


Solution

  • I resolve that by adding import 'moment/locale/fr'; on my component.