如何解决使用KeyboardDatePicker在React.js中两个日期之间的月份差异
const Index = (props) => {
const [selectedDate,setSelectedDate] = useState(
new Date("2014-08-18T21:11:54")
);
const handleDateChange = (date) => {
setSelectedDate(date);
};
return (
<div>
//first date picker
<MuiPickersUtilsProvider
utils={DateFnsUtils}
// className={classes.formControlNew}
style={{ width: "100%" }}
>
<KeyboardDatePicker
style={{ marginLeft: "5%",width: "91%" }}
margin="normal"
id="date-picker-dialog1"
label="Start Date"
format="MM/dd/yyyy"
value={selectedDate}
onChange={handleDateChange}
KeyboardButtonProps={{
"aria-label": "change date",}}
/>
</MuiPickersUtilsProvider>
// second date picker
<MuiPickersUtilsProvider
utils={DateFnsUtils}
style={{ width: "100%" }}
>
<KeyboardDatePicker
style={{ marginLeft: "5%",width: "91%" }}
margin="normal"
id="date-picker-dialog2"
label="End Date"
format="MM/dd/yyyy"
value={selectedDate}
onChange={handleDateChange}
KeyboardButtonProps={{
"aria-label": "change date",}}
/>
</MuiPickersUtilsProvider>
</div>
);
};
有两个日期选择器,我使用它们从用户那里获取两个日期。其中第一个日期是开始日期,第二个是结束日期。我想以月为单位计算这两个日期之间的差异。我应如何以月为单位计算差异?在Reactjs中需要完成哪些计算。
解决方法
这里缺少一些东西。
-
您将要复制
selectedDate
和handleDateChange
,以便可以分别跟踪两个日期。也许selectedStartDate
和selectedEndDate
-
要计算差异,我建议使用
moment
npm软件包,其语法类似于:
const months = moment.duration(moment(selectedEndDate).diff(moment(selectedStartDate))).asMinutes()
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。