如何让react-datepicker从星期一开始一周中的日子?

Sze*_*mat 15 reactjs react-datepicker date-fns

我正在使用react-datepickerdate-fns在我的网络应用程序中显示带有匈牙利语言环境的日期选择器,但我找不到一种方法让它显示从星期一开始的一周日期,而不是按照匈牙利惯例从星期日开始。日期选择器看起来像这样(V 是 Vas\xc3\xa1rnap 的缩写,这当然意味着星期日):

\n

具有匈牙利语言环境的反应日期选择器

\n

这是我用来渲染它的代码:

\n
import DatePicker, { registerLocale } from "react-datepicker";\nimport "react-datepicker/dist/react-datepicker.css";\nimport hu from "date-fns/locale/hu";\n\nregisterLocale("hu", hu);\n\nexport function CustomDatepicker(props) {\n    return (\n        <DatePicker className="form-control" selected={props.date} \n        onChange={ props.onChange } dropdownMode="select"\n        dateFormat="yyyy.MM.dd." todayButton="Ma" closeOnScroll={true}\n        locale="hu" />\n    );\n}\n
Run Code Online (Sandbox Code Playgroud)\n

我还尝试实现这项工作的一个想法是我在这个 GitHub 问题中找到的以下代码(将数字 0 修改为 1):

\n
registerLocale("hu", { ...hu, options: { ...hu.options, weekStartsOn: 1 } });\n
Run Code Online (Sandbox Code Playgroud)\n

有没有其他方法可以完成这项工作,或者我应该使用不同的包进行本地化?

\n

小智 24

您只需将额外的属性 (calendarStartDay={1}) 传递给 DatePicker

import DatePicker, { registerLocale } from "react-datepicker";
import "react-datepicker/dist/react-datepicker.css";
import hu from "date-fns/locale/hu";

registerLocale('hu', hu);
function App(props) {
  return (
    <div className="App">
      <DatePicker
        className="form-control"
        selected={props.date}
        onChange={props.onChange}
        dropdownMode="select"
        dateFormat="yyyy.MM.dd."
        todayButton="Ma"
        closeOnScroll={true}
        locale="hu"
       calendarStartDay={1}
      />
    </div>
  );
}

export default App;

Run Code Online (Sandbox Code Playgroud)

在此输入图像描述