使用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中需要完成哪些计算。

解决方法

这里缺少一些东西。

1. 您将要复制selectedDate和handleDateChange，以便可以分别跟踪两个日期。也许selectedStartDate和selectedEndDate

2. 要计算差异，我建议使用moment npm软件包，其语法类似于：

const months = moment.duration(moment(selectedEndDate).diff(moment(selectedStartDate))).asMinutes()