Reactjs 如何使用react day picker发布正确的工作日

在我的React应用程序中，我试图使用库

React day picker

将周值发送到服务器，但它会以一天的间隔将值发送到服务器

例如，当我在客户端选择从2021-03-07到2021-03-13之间的一周时，我可以在日志中看到该周已正确发送，但在服务器中，我得到了具有1天偏移量的值，如下所示：

  selectedDays: [
    '2021-03-06T22:00:00.000Z',
    '2021-03-07T22:00:00.000Z',
    '2021-03-08T22:00:00.000Z',
    '2021-03-09T22:00:00.000Z',
    '2021-03-10T22:00:00.000Z',
    '2021-03-11T22:00:00.000Z',
    '2021-03-12T22:00:00.000Z'
  ]

这是我的客户代码：

console.log(data);
// I get here the correct week values

axios({
  method: "post",
  url: "http://localhost:3001/",
  data: data,
}).then(
  (res) => {
    console.log(res);
  },
  (error) => {
    console.log(error);
  }
);

我的服务器代码：

exports.createNewGoals = async (request, response) => {
   
 // I get here the values with one day interval.
 console.log(request.body.selectedDays);

}

我猜这可能与本地化设置有关，但我没有定义任何自定义本地化设置。 我正在Chrome浏览器的Windows机器（he il）上本地运行该项目

日期在哪里更改？如何正确配置

---

任何帮助都将不胜感激

这确实是时区不匹配。客户端正在向服务器发送本地时间，服务器正在解析/将其保存为UTC，并且由于您的时区早于GMT，因此12:00AM将始终落后一天。服务器很可能配置为GMT，这是一种良好的做法，因为web服务器将在多个时区拥有用户，因此它需要一种通用的方法来准确存储时间。如果您不需要转换，根据您的控件和要求，有几种方法：

在客户端上转换为UTC

在getWeekDays的示例中，客户机选择本地时间的日期，并使用矩库，然后转换回日期。默认情况下，在用户时间内准确捕获用户的选择，包括其时区偏移：

Sun Mar 14 2021 00:00:00 GMT-0500 (Eastern Standard Time), 
Mon Mar 15 2021 00:00:00 GMT-0400 (Eastern Daylight Time), 
Tue Mar 16 2021 00:00:00 GMT-0400 (Eastern Daylight Time), 
Wed Mar 17 2021 00:00:00 GMT-0400 (Eastern Daylight Time), 
Thu Mar 18 2021 00:00:00 GMT-0400 (Eastern Daylight Time), 
Fri Mar 19 2021 00:00:00 GMT-0400 (Eastern Daylight Time), 
Sat Mar 20 2021 00:00:00 GMT-0400 (Eastern Daylight Time)

如果要捕获用户单击的日历日期，可以使用

.UTC（true）

将其转换为UTC而不更改时间，然后再转换为JavaScript日期。这是将日期的值设置为“UTC中12:00AM时此位置的时间”。客户端将以本地方式发送，但在服务器上转换后，它将在预期日期转换回12:00UTC：

function getWeekDays(weekStart) {
  const days = [moment(weekStart).utc(true).toDate()];
  for (let i = 1; i < 7; i += 1) {
    days.push(
      moment(weekStart)
        .add(i, 'days')
        .utc(true).toDate()
    );
  }
  console.log (days);
  return days;
}

只需发送日期

如果不需要时间转换，只发送一个没有时间的日期通常会简单得多：

 function getWeekDays(weekStart) {
      const days = [moment(weekStart).format('YYYY-MM-DD')];
      for (let i = 1; i < 7; i += 1) {
        days.push(
          moment(weekStart)
            .add(i, 'days')
            .format('YYYY-MM-DD')
        );
      }
      console.log (days);
      return days;
    }

或者更简单一些，避免任何时间混淆，将其键入字符串，然后忽略本地时间组件：

exports.createNewGoals = async (request, response) => {
   
 // I get here the values with one day interval.
 request.body.selectedDays.forEach(dt=> console.log(dt.substring(0, 10)));

}

---

似乎是正确的。在您的本地时区中，

2021-03-06T22:00:00.000Z

对应于

2021-03-07

。您可以将数据保存在数据库中。稍后，在前端/客户端上，当您显示带有新日期的日期时（“2021-03-06T22:00:00.000Z”）您将获得与本地时区对应的日期，即：

2021-03-07

。谢谢。你的回答对我帮助很大。我最终在服务器中转换为本地日期。

exports.createNewGoals = async (request, response) => {
   
 // I get here the values with one day interval.
 request.body.selectedDays.forEach(dt=> console.log(moment(dt).local()));

}

exports.createNewGoals = async (request, response) => {
   
 // I get here the values with one day interval.
 request.body.selectedDays.forEach(dt=> console.log(dt.substring(0, 10)));

}