如何让 react-datepicker 在星期一开始一周中的几天?
How to make react-datepicker start the days of the week on Monday?
我正在使用 react-datepicker
和 date-fns
在我的 Web 应用程序中显示带有匈牙利语言环境的日期选择器,但我找不到方法来显示日期根据匈牙利惯例,一周从星期一开始,而不是从星期日开始。日期选择器看起来像这样(V 是 Vasárnap 的缩写,当然是指星期日):
这是我用来渲染它的代码:
import DatePicker, { registerLocale } from "react-datepicker";
import "react-datepicker/dist/react-datepicker.css";
import hu from "date-fns/locale/hu";
registerLocale("hu", hu);
export function CustomDatepicker(props) {
return (
<DatePicker className="form-control" selected={props.date}
onChange={ props.onChange } dropdownMode="select"
dateFormat="yyyy.MM.dd." todayButton="Ma" closeOnScroll={true}
locale="hu" />
);
}
我也试图使这项工作的一个想法是我在 this GitHub issue 中找到的以下代码(将数字 0 修改为 1):
registerLocale("hu", { ...hu, options: { ...hu.options, weekStartsOn: 1 } });
有没有其他方法可以完成这项工作,或者我应该使用不同的包进行本地化吗?
您只需要将一个额外的道具 (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;
我正在使用 react-datepicker
和 date-fns
在我的 Web 应用程序中显示带有匈牙利语言环境的日期选择器,但我找不到方法来显示日期根据匈牙利惯例,一周从星期一开始,而不是从星期日开始。日期选择器看起来像这样(V 是 Vasárnap 的缩写,当然是指星期日):
这是我用来渲染它的代码:
import DatePicker, { registerLocale } from "react-datepicker";
import "react-datepicker/dist/react-datepicker.css";
import hu from "date-fns/locale/hu";
registerLocale("hu", hu);
export function CustomDatepicker(props) {
return (
<DatePicker className="form-control" selected={props.date}
onChange={ props.onChange } dropdownMode="select"
dateFormat="yyyy.MM.dd." todayButton="Ma" closeOnScroll={true}
locale="hu" />
);
}
我也试图使这项工作的一个想法是我在 this GitHub issue 中找到的以下代码(将数字 0 修改为 1):
registerLocale("hu", { ...hu, options: { ...hu.options, weekStartsOn: 1 } });
有没有其他方法可以完成这项工作,或者我应该使用不同的包进行本地化吗?
您只需要将一个额外的道具 (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;