0

我已经搜索过 SO 并找到了解决方案，但他们不使用 date-fns 或者只是不工作，因为他们正在计算天数，而我只关注同一天的几个小时。

我正在尝试计算两个日期之间的差异，或者更具体地说，是同一天的几个小时之间的差异，以便我可以知道有人打卡和打卡的时间，并计算他们当天工作的小时数。

我正在使用 date-fns

如果我跑，console.log(this.myForm.value.startTime)我会得到14:00.

如果我跑，console.log(this.myForm.value.endTime)我会得到16:00.

这是我计算小时数的函数。

updateHours() {
    var end = dateFns.format(new Date(this.myForm.value.endTime, 'HH:mm'));
    var start = dateFns.format(new Date(this.myForm.value.startTime, 'HH:mm'));
    var result = dateFns.differenceInMinutes(
        new Date(end),
        new Date(start)
    )
    console.log(result);
}

的价值result永远是NaN

我究竟做错了什么？

4

2 回答 2

1

正在进行不正确的解析，因为您只想获得差异，minutes因此遵循这种方法会更容易。

设置为的值end和start变量在原始代码中未定义。

在下面的代码片段中，我创建了一个新日期，使用 date 方法设置小时和分钟.setHours()。

date.setHours(0, 0, 0);   // Set hours, minutes and seconds


var start_time = "14:00";
var end_time = "16:00";

function updateHours() {
  var current = new Date();
  var start = current.setHours(start_time.split(":")[0], start_time.split(":")[1], 0);
  var end = current.setHours(end_time.split(":")[0], end_time.split(":")[1], 0);
  console.log(start, end)
  var result = dateFns.differenceInMinutes(
    end,
    start
  )
  console.log(result);
}
updateHours();
.as-console {
  height: 100%;
}

.as-console-wrapper {
  max-height: 100% !important;
  top: 0;
  text-align:center;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/date-fns/1.29.0/date_fns.min.js"></script>

参考：

  1. 设置时间
于 2017-10-20T19:46:52.907 回答
0

我认为如果你有两个Date对象，那么减去差异真的很容易Date.prototype.getTime（所以不要用 dateFns 格式化）

var minutes = Math.abs(start.getTime() - end.getTime()) / 60000 // display in minutes

你也可以圆它，Math.round(minutes)

希望能帮助到你 ：）

于 2017-10-20T19:40:21.540 回答