Javascript 完整日历-区分过去事件和未来事件

我想在fullcalendar中区分过去事件和未来事件。我已加载并呈现了日历中的所有事件。如何使用两种不同的颜色区分过去事件和未来事件。以下是

---

这可以从服务器端实现；在将事件数据发送到客户端之前，或在从服务器接收事件数据之后在客户端上。但请始终记住，由于客户端计算机上的时间不正确或时区不同，服务器时间和客户端之间可能存在时间差。 同时，我创建了一个示例来展示客户端实现

$(document).ready(function() {

    $('#calendar').fullCalendar({
        //theme: true,
        eventBorderColor: '#A5C9FF', //General Event Border Color
        eventBackgroundColor: '#1168AC', //General Event Background Color
        header: {
            left: 'prev,next today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay'
        },
        defaultDate: "2014-08-22",
        editable: true,
        events: {
            url: 'http://www.json-generator.com/api/json/get/ccUKVDYErS?indent=2',
            error: function() {
                $('#script-warning').show();
            },
            success: function(data){
                for(var i=0; i<data.length; i++){//The background color for past events
                    if(moment(data[i].start).isBefore(moment())){//If event time is in the past change the general event background & border color
                        data[i]["backgroundColor"]="#48850B";
                        data[i]["borderColor"]="#336600";
                    }
                }
            }
        },
        loading: function(bool) {
            $('#loading').toggle(bool);
        }
    });

});

$（文档）.ready（函数（）{
$（“#日历”）.fullCalendar({
//主题：真的，
eventBorderColor:“#A5C9FF”，//常规事件边框颜色
eventBackgroundColor:“#1168AC”，//一般事件背景色
标题：{
左：“上一个，下一个今天”，
中心：'标题'，
右图：“月，agendaWeek，agendaDay”
},
违约日期：“2014-08-22”，
是的，
活动：{
网址：'http://www.json-generator.com/api/json/get/ccUKVDYErS?indent=2',
错误：函数（）{
$（“#脚本警告”）.show（）；
},
成功：功能（数据）{
对于（var i=0；iGreat@Paullo感谢bro的帮助：）我在我的react项目中已经完成了这项工作，它工作得很好。结果事件将是这样的。{标题：“423”开始：周二1月7日2020 00:00:00 GMT+0530（印度标准时间）{}全天：真文本颜色：“蓝色”
$(document).ready(function() {

    $('#calendar').fullCalendar({
        //theme: true,
        eventBorderColor: '#A5C9FF', //General Event Border Color
        eventBackgroundColor: '#1168AC', //General Event Background Color
        header: {
            left: 'prev,next today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay'
        },
        defaultDate: "2014-08-22",
        editable: true,
        events: {
            url: 'http://www.json-generator.com/api/json/get/ccUKVDYErS?indent=2',
            error: function() {
                $('#script-warning').show();
            },
            success: function(data){
                for(var i=0; i<data.length; i++){//The background color for past events
                    if(moment(data[i].start).isBefore(moment())){//If event time is in the past change the general event background & border color
                        data[i]["backgroundColor"]="#48850B";
                        data[i]["borderColor"]="#336600";
                    }
                }
            }
        },
        loading: function(bool) {
            $('#loading').toggle(bool);
        }
    });

});

   eventDataTransform = (eventData) => {
    let newDate = new Date();
      if(new Date(newDate.setHours(0, 0, 0, 0)).getTime() > eventData.start.getTime()){            
         eventData.color = "grey";   //For background     
          eventData.textColor = "black";
      }else{
          eventData.color = "blue";    
          eventData.textColor = "white";
      }
      return eventData;
  }