我正在使用React Datepicker,并且一切正常。
我不想在一周中的几天内都使用“Su”,“Mo”,“Tu”等内容,而是要使用以下内容:
"Sun" "Mon" "Tue"
我是通过CSS完成此操作的:
.react-datepicker__day-name {
...
&:first-child {
&:after {
visibility: visible;
position: relative;
left: -0.5rem;
text-align: center;
content: "Sun";
}
}
}
它似乎可以工作,但看起来也很“hacky”。是否缺少我可以指定要使用的格式的配置选项?
感谢您的任何建议!
编辑
这是我(尝试)将
dateFormat
传递到我的组件的方式:App.js
this.state = {
startDate: new Date(),
dateFormat: 'ddd'
};
...
render() {
...
<ReservationCalendar
dateFormat={ this.state.dateFormat }
startDate={ this.state.startDate }
/>
}
ReservationCalendar.js
const ReservationCalendar = ({dateFormat, startDate}) => (
<Calendar
dateFormat={ dateFormat }
startDate={ startDate }/>
);
export default ReservationCalendar;
DatePicker.js
const Calendar = ({dateFormat, startDate}) => (
<div className="my-calendar">
<DatePicker
inline
dateFormat={ dateFormat }
selected={ startDate }
/>
</div>
);
export default Calendar;
有了这样的一切,我仍然可以得到像我所附加的 View 。也许我没有正确地传递一些东西。再次感谢您的宝贵时间!
最佳答案
最近在工作中需要类似的东西。这就是我能够使用formatWeekDay
prop做到的方式:
<DatePicker
formatWeekDay={nameOfDay => nameOfDay.substr(0,3)}
/>;
注意:虽然在面向公众的文档中找不到此 Prop 。
关于reactjs - 如何更改星期 react 日期选择器的格式?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56603144/