React-datepicker: Changing day headings?

Created on 22 Sep 2018  路  3Comments  路  Source: Hacker0x01/react-datepicker

The default markers for the week days is:
Su Mo Tu We Th Fr Sa

Is there any way these can be modified ? Say week day name prop that could take, e.g.,:
dayNames={ sun: 'S', mon: 'M', tue: 'T', wed: 'W', th: 'T', fr: 'F', sa: 'S' }
?

Most helpful comment

Figured out a way to do it with version 2.8.0. Looks like there is an undocumented prop that you can pass in like so:

<DatePicker
  selected={selectedDate}
  onChange={setSelectedDate}
  formatWeekDay={(dayOfWeekLabel) => dayOfWeekLabel.substring(0, 3)}
  {...props}
/>

Which results in this:
Screen Shot 2019-08-06 at 2 29 51 PM

All 3 comments

Figured out how to do this via moment configuration.

@kkras3 Could you give an example of how you solved this via configuration?

Figured out a way to do it with version 2.8.0. Looks like there is an undocumented prop that you can pass in like so:

<DatePicker
  selected={selectedDate}
  onChange={setSelectedDate}
  formatWeekDay={(dayOfWeekLabel) => dayOfWeekLabel.substring(0, 3)}
  {...props}
/>

Which results in this:
Screen Shot 2019-08-06 at 2 29 51 PM

Was this page helpful?
0 / 5 - 0 ratings

Related issues

jcabrerazuniga picture jcabrerazuniga  路  3Comments

ahribori picture ahribori  路  3Comments

formigone picture formigone  路  3Comments

jbccollins picture jbccollins  路  3Comments

goxr3plus picture goxr3plus  路  3Comments