CODEWITHSUNDEEP
reactjsantd
HaZcker
HaZcker

Reputation: 245

AntDesing. DatePicker. Change selection year

enter image description here

Now, if I use DatePicker Ant Design by default I have 2020 to choose from.
How do I make a different year open by default, such as 2000, or another
But not in all components, but in some

p.s. - sorry for my english

Upvotes: 0

Views: 643

Answers (2)

Abraham Labkovsky
Abraham Labkovsky

Reputation: 1956

The default date type is a momentjs object

You can set an initial value if you are using a state object to store the value.

If you want it to be today's date in a specific year you can do something like moment().set('year', 2013) as your initial value. To just add or subtract x amount of years from today use moment().add(x, 'years') or moment().subtract(x, 'years') or just use a formatted date string for a fixed date.

The docs in momentjs are fantastic.

In a functional component this looks something like this:

const [date, setDate] = useState(moment().add(1, 'years'));

Just make sure to set the value and onChange in the Datepicker...

Upvotes: 0

Adam Rogers
Adam Rogers

Reputation: 26

If you create a component and put your picker inside it you could pass through prop with your custom date you'd like to use. Then in your component use a conditional statement to check if the prop is passed, if so use the custom date if not 'null' which will force the default value.

I've whipped up a quick code sandbox with an example.

https://codesandbox.io/s/gracious-gagarin-2520c

Upvotes: 1

Related Questions