如何将 Google 日历事件转换为 react-big-calendar 的日期对象

Question

所以我想使用 RBC 的周视图。我不断得到 TypeError: date[("get" + method)] 不是函数

有几个问题报告都说我需要一个date对象，实际上，当我使用这个例子时我可以打开日历

var myEventsList = [{
 {
    'title': 'Meeting',
    'start': new Date(2017, 3, 12, 10, 30, 0, 0),
    'end': new Date(2017, 3, 12, 12, 30, 0, 0),
    desc: 'Pre-meeting meeting, to prepare for the meeting'
 },
   {
    'title': 'Lunch',
      'start':new Date(2017, 3, 12, 12, 0, 0, 0),
      'end': new Date(2017, 3, 12, 13, 0, 0, 0),
    desc: 'Power lunch'
  }]

所以我知道我需要将我的 start: 2019-05-14T12:00:00.000Z, 转换为 new Date( x,x,x,x,x)

我试过在后端用这样的东西做这个

      for (let i = 0; i < data.length; i++) {
          events.push({
          title: data[i].summary,
          start: new Date(data[i].start.dateTime),
          end: new Date(data[i].end.dateTime)

我还尝试了 moment(data[i].start.dateTime) 以及一系列不同的 google 搜索建议，包括各种 .format()、.todate() 等，但我不断收到错误。

更新：

我也试过用这个位在我的前端设置它

 const events=[]
 const makeDatobj = (data) =>{
   events.map(event => ({
    title : event.title,
     start : new Date(event.start)
   }));

我希望用

初始化

    <BigCalendar
            ...
             localizer={localizer}
             events={events=>makedatobj(data)}
             step={70}
             timeslots={2}
             defaultView="week"
             ...
           />

但这给了我 TypeError: data.map is not a function

这只是提醒我，我不知道 .map() 是如何工作的，而且当我尝试使用它时，我不断遇到类似的问题......我已经尝试了一些其他的解析方法具有类似故障程度的传入数据。我注意到当我尝试处理传入的数据时，我无意中关闭了我的 api 请求，所以我没有任何数据可以使用......我真的让这种方式变得比它需要的更困难成为。

我只需要一个简单的答案。我该如何转换。 start: 2019-05-14T12:00:00.000Z, 开始：new date( x,x,x,x,x) ?

Answer 1

Date constructor也可以将字符串作为参数，所以可以这样做：

start : new Date("2019-05-14T12:00:00.000Z")

听起来您的后端应该是这样的，将日期作为字符串返回：

for (let i = 0; i < data.length; i++) {
  events.push({
  title: data[i].summary,
  start: data[i].start.dateTime,
  end: data[i].end.dateTime
}

你的前端代码应该是这样的，将它们转换为 Javascript 日期：

events.map(event => ({
  title : event.title,
  start : new Date(event.start)
}));

如何将 Google 日历事件转换为 react-big-calendar 的日期对象

How can I convert Google calendar events to date object for react-big-calendar

javascript

arrays

datetime

momentjs

react-big-calendar