问题描述
我试图将两个日期选择器的值保存到一个变量中,这样我就可以计算两个日期之间的差异。目前 DatePicker 正在从 App.tsx 接收 id,并且这个想法是在单击 DatePicker 后将此 ID 返回到主应用程序,因此我可以将结果保存到不同的变量中。但是,DatePicker 函数不断返回正在单击第一个 DatePicker 而不是第二个 DatePicker,我不确定为什么。这是 DatePicker 的代码
export const DatePickerBasicExample = (props) => {
const [value,setValue] = React.useState<Date | null | undefined>(null);
const [id,setID] = React.useState<Date | null | undefined>(null);
const onSelectDate = (date: Date | null | undefined): void => {
setValue(date);
const clickedID = id;
props.getData(clickedID,date);
};
const getClickedElement = (e) => {
setID(e.target.id);
}
return (
<div className={styles.datepicker}>
<DatePicker
id={props.id}
className={controlClass.control}
formatDate={(date: Date): string => {
return date.getDate() + '.' + (date.getMonth() + 1) + '.' + (date.getFullYear() );
}}
label={props.label}
isrequired={false}
allowTextInput={true}
firstDayOfWeek={firstDayOfWeek}
strings={DayPickerStrings}
value={value!}
onClick={getClickedElement}
// eslint-disable-next-line react/jsx-no-bind
onSelectDate={onSelectDate}
/>
</div>
);
};
这是将数据保存到变量中的函数。 console.log 只是为了排查问题,无论我点击哪个元素,每次都会返回“StartDatum”的ID
getData = (id,data) => {
if (id="StartDatum"){
Date1 = data;
console.log(id);
} else {
Date2 = data;
console.log(id);
}
console.log(Date1);
console.log(Date2);
}
我尝试了许多不同的方法来更新 Datepicker 的 id,但似乎都没有奏效。任何建议将不胜感激。
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)