6

我使用 DayPickerInput 组件来为表单上的字段添加日期，并且我想以不同的语言（希伯来语，就此而言）显示日期和月份。在库的 API 中，我找到了一种非常简单的方法来更改基本组件（DayPicker）的语言，但据我了解，这种方法不适用于 DayPickerInput。

它设法更改所选日期的语言（在字段本身中），但不能更改选择器中的显示。

例如，

import React from "react";
import ReactDOM from "react-dom";

import DayPicker from "react-day-picker";

import MomentLocaleUtils from "react-day-picker/moment";

import "react-day-picker/lib/style.css";

import "moment/locale/he";

function LocalizedExample() {
  return (
    <div>
      <p>Hebrew</p>
      <DayPicker localeUtils={MomentLocaleUtils} locale="he" />
    </div>
  );
}

ReactDOM.render(<LocalizedExample />, document.getElementById("root"));

使用此代码，语言会根据需要更改，但会进行以下更改（在第三行中）：

import DayPicker from "react-day-picker/DayPickerInput";

语言仍然是英语。

有没有办法做到这一点？

4

2 回答 2

4

DayPickerInput有一个叫dayPickerProps. 我认为你需要使用它。

例子

import { DayPickerInput } from 'react-day-picker';

<DayPickerInput dayPickerProps={{localeUtils: MomentLocaleUtils, locale:"he"}} />
于 2017-10-25T13:44:15.243 回答
3

看起来你需要通过localeand localeUtilsas dayPickerProps：

import "react-day-picker/lib/style.css";

import "moment/locale/he";

function LocalizedExample() {
  const dayPickerProps = {
    localeUtils: MomentLocaleUtils,
    locale: "he"
  }
  return (
    <div>
      <p>Hebrew</p>
      <DayPicker dayPickerProps={dayPickerProps} />
    </div>
  );
}

ReactDOM.render(<LocalizedExample />, document.getElementById("root"));
于 2017-10-25T13:44:48.827 回答