如何为 react-big-calendar (fullcalendar.js) 设置 momentLocalizer (moment.js)？

IT技术 javascript reactjs momentjs
2021-04-26 19:23:25

我正在使用react-big-calendar 并且需要帮助来实现所需的本地化来自 git 的示例

import BigCalendar from 'react-big-calendar';
import moment from 'moment';

BigCalendar.setLocalizer(
  BigCalendar.momentLocalizer(moment)
);

我的代码

var moment = require('moment');
var momentLocalizer = require('react-widgets/lib/localizers/moment');
import BigCalendar from 'react-big-calendar';

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

let MyCalendar = props => (
    <div>
        <BigCalendar

        />
    </div>
);

无论我试过什么都行不通

未捕获的类型错误：moment 不是函数

2个回答

我必须导入我想要在正确的语言环境中获取日历的语言环境。

请注意import 'moment/locale/nb';.

import React, { Component } from 'react';
import BigCalendar from 'react-big-calendar';
import moment from 'moment';
import 'moment/locale/nb';
import 'react-big-calendar/lib/css/react-big-calendar.css';

BigCalendar.setLocalizer(BigCalendar.momentLocalizer(moment));

class Calendar extends Component {
  constructor() {
    super();
    this.state = {
      events: [],
    };
  }

  render() {
    return (
      <div className="Calendar">
        <BigCalendar
          events={this.state.events}
        />
      </div>
    );
  }
}

这是针对react-big-calendar 的0.17.0 版。

我的代码在下面，它对我有用。culture如果我想更改本地化，我只需在 BigCalendar 上设置props。

import React, { Component } from 'react';
import 'react-big-calendar/lib/css/react-big-calendar.css'
import BigCalendar from 'react-big-calendar';
import moment from 'moment';

BigCalendar.momentLocalizer(moment);

class Calendar extends Component {
    constructor(props, context) {
      super(props, context);
    }

    render() {
      return (
        <div>
          <BigCalendar
            culture='en-GB'
            events={this.props.tasks}
            views={['month', 'week']}/>
        </div>
      );
    }
  }
其它你可能感兴趣的问题
上一篇使用 Enzyme 测试 Redux 连接的组件 下一篇react-router或链接未呈现