How to change react-dates datepicker's language to German?

Question

I'm trying to change my <DateRangePicker/> to German. What am I doing wrong?

render(){
          moment.locale('de')

return(
                        <DateRangePicker
                                              startDate={this.state.startDate} // momentPropTypes.momentObj or null,
                                              endDate={this.state.endDate} // momentPropTypes.momentObj or null,
                                              onDatesChange={({ startDate, endDate }) => {

                                                this.setState({ endDate, startDate,
                                                  startDateString: startDateString,
                                                  endDateString: endDateString})}} // PropTypes.func.isRequired,
                                              focusedInput={this.state.focusedInput} // PropTypes.oneOf([START_DATE, END_DATE]) or null,
                                              onFocusChange={focusedInput => this.setState({ focusedInput }) } // PropTypes.func.isRequired,
                                              endDatePlaceholderText={"Bis"}
                                              startDatePlaceholderText={"Ab"}
                                              displayFormat={"DD/MM/YYYY"}
                                              showDefaultInputIcon={false}
                                          />
)
}

Give an example of date output you expect, you have DD/MM/YYYY there but German format uses periods (`.`). I believe you also only need to do `moment.locale('de')` once when your app loads rather than in the render method of this component — Dominic, Jun 12 '18 at 12:51
Impossible to tell for sure without further detail from OP but possible duplicate of [react-moment where to set moment.locale](https://stackoverflow.com/questions/51769039/react-moment-where-to-set-moment-locale) — Blanc, Sep 12 '19 at 18:24

score 2 · Answer 1 · answered Nov 08 '19 at 02:52

2

To set language for react-dates, there are 2 ways to do it:

1.

import moment from 'moment';
componentDidMount() {
  moment.locale('ge');
}

import 'moment/locale/ge'

answered Nov 08 '19 at 02:52

Thanh Ngo

367
2
15

score -2 · Answer 2 · answered Feb 15 '19 at 12:55

-2

Make sure to have in your npm moment js and import it into the componentholding of that datepicker

answered Feb 15 '19 at 12:55

user3420292

1

3

Just a tip: it would be nice to add why you think this would fix the OP's problem. – shkaper Feb 15 '19 at 13:05
Doesn't the line moment.locale('de') imply that this has been already done? Probably the OP is facing another problem. – Blanc Sep 12 '19 at 17:53

How to change react-dates datepicker's language to German?

2 Answers2