2016-04-09 1 views
2

私はreact-big-calendar(fullcalendar.js)のmomentLocalizer(moment.js)を設定するにはどうすればよいですか?

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> 
); 

は動作しませんreact-big-calendar を使用してgitのから 例を必要とするローカリゼーションを実装するために助けが必要だ

Uncaught TypeError: moment is not a function

答えて

1

私の下のコードは、私のために働く。ローカライゼーションを変更したい場合は、単にBigCalendarにculture小道具を設定します。

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> 
    ); 
    } 
    } 
+0

cldr-dataとglobalize ...インストールしなければならなかったもの。あなたの助けをありがとう – user3315525

+0

私は同様の質問があります:私は英語で私のBigCalendarがカスタムタイムゾーンではなく、ヨーロッパ/ロンドンしたい。それをどうすれば実現できますか? – Pawel

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> 
    ); 
    } 
} 

これはのバージョン0.17.0反応-ビッグカレンダーをためです。

関連する問題