Ant 设计：从 onChange 中的 datepicker 获取 Id

Question

I've a form with multiple Datepickers in a React-Redux app and I need to know the id of the Datepicker that has been used.

When the datepickers are created I can assign a function to the onChange method (this method has two params (dates) to use).

<DatePicker
   title={field.title}
   placeholder={field.title}    
   format={"YYYY/MM/DD"}
   size={params.fieldsize}
   onChange={this.handleDatePickerChange}
/>

I need to retrieve the id of the Datepicker inside the handleDatePickerChange function:

handleDatePickerChange = (date, dateString) => {
   // get the id
   ...
}

The (date, dateString) are the params of the returned callback function. See method onChange in https://ant.design/components/date-picker/#DatePicker

A callback function, can be executed when the selected time is changing.

How can I do that?

Answer 1

You can send an extra variable in onChange function as below:

onChange={(date, dateString) => this.handleDatePickerChange(date, dateString, 1)}

And then in handleDatePickerChange method you can get it as given below:

handleDatePickerChange = (date, dateString, id) => {
   console.log(id);
   ...
}

I have created a demo on codesandbox.io .