如何将 UTC 日期转换为 fullCalendar.io 中的用户时区

Question

我有一个 UTC 格式的日期和时间，例如：

我的日历生成代码。我正在使用 fullcalendar.io.

//for loop start
sessionCalendar.push(
    {
      title: `${course["course_name"]}`,
      start: start_date_time.split(" ").join("T"),
      end: end_date_time.split(" ").join("T"),
    },
)
//for loops end

如您所见，我在日期和时间中间添加了 T 以使其成为 UTC 格式。

var calendarEl = document.getElementById('calendar');
var calendar = new FullCalendar.Calendar(calendarEl, {
  plugins: [ 'dayGrid', 'timeGrid', 'list', 'interaction' ],
  header: {
    left: 'prev,next today',
    center: 'title',
    right: 'dayGridMonth,timeGridWeek,timeGridDay,listWeek'
  },
  defaultDate: '2019-04-12',
  navLinks: true, 
  editable: false,
  eventLimit: true,
  events: sessionCalendar,
  timeZone: timeZone // var timeZone = "Asia/Kolkata"
});

calendar.render();

在上面的代码中，我设置了动态的时区值。不过，我在 UTC 格式的屏幕截图中看到与 start_date_time 相同的日期和时间。

如何将 UTC 日期和时间转换为用户指定的时区？

根据评论。我在最后加了"Z"

Answer 1

函数 convertDateAccordingToTZ(dateString: string, timeZoneOffset: number = 0) {

const dateObj = new Date(dateString);
const calculatedOffset = dateObj.getTimezoneOffset() + (timeZoneOffset * 60);
const formattedTime = dateObj.valueOf() + (calculatedOffset * 60000);

return new Date(formattedTime);

}

Answer 2

我已经解决了问题，但不是真正的问题。

在调用初始化日历之前，我将日期和时间转换为用户特定的时区。

datetime_utc: function (datetime) {
    return moment.utc(datetime, 'YYYY-MM-DD HH:mm:ss').clone().tz(timeZone).format('YYYY-MM-DD HH:mm:ss');
},

上述 moemnt 函数可以轻松地将日期和时间转换为用户特定的时区。我刚刚更新了时间。我还从日历功能中删除了时区属性。

//for loop start
sessionCalendar.push(
    {
      title: `${course["course_name"]}`,
      start: gbl.datetime_utc(start_date_time),
      end: gbl.datetime_utc(end_date_time),
    },
)
//for loops end

var calendarEl = document.getElementById('calendar');
var calendar = new FullCalendar.Calendar(calendarEl, {
  plugins: [ 'dayGrid', 'timeGrid', 'list', 'interaction' ],
  header: {
    left: 'prev,next today',
    center: 'title',
    right: 'dayGridMonth,timeGridWeek,timeGridDay,listWeek'
  },
  defaultDate: '2019-04-12',
  navLinks: true, 
  editable: false,
  eventLimit: true,
  events: sessionCalendar,
});

calendar.render();

这仍然是一个非常不完整的答案。 Fullcalendar.io 代码应该可以完成这项工作。

如何将 UTC 日期转换为 fullCalendar.io 中的用户时区

How do I convert UTC date into user timezone in fullCalendar.io

javascript

jquery

timezone

fullcalendar

momentjs