fullcalendar.io上的事件加倍

Question

我在我的项目中使用rails和react.js。假设我创建了事件A，但后来我改变了主意并取消了它(通过引导模式)，然后我启动了另一个事件B，并确认了它，事件A仍然被创建。我是不是遗漏了什么？

componentDidMount: function(){
    var self = this;
    var events = [];
    $('#calendar').fullCalendar({
      googleCalendarApiKey: self.props.publicApi,
      defaultView: 'agendaWeek',
      minTime: '08:00:00',
      maxTime: '18:00:00',
      height: 'auto',
      timezone: 'local',
      firstDay: moment().day(),
      allDaySlot: false,
      selectable: true,
      select: function(start, end){
        $('#myModal').modal('show')
        $('#proceed-to-payment').on('click', function(){
          var durationString = $('#time-select').find(':selected').text()
          var duration = parseFloat(durationString)
          var eventData;

          end.set('hour', start.hour() + duration  )
          end.set('minutes', start.minutes())
          eventData = {
            title: "New Event",
            start: start.format(),
            end: end.format()
          };
          $('.fc-event').remove();
          $('#calendar').fullCalendar('renderEvent', eventData);

          var url = '/appointment/' + self.state.sportCenter.id + '/appointments'
          $.post(url, {
            start: start.format(),
            duration: duration,
            title: "Appointment set by " + self.state.user.first_name + " " + self.state.user.last_name,
            user_id: self.state.user.id,
            appointment_id: self.state.appointment.id
          })

        })

        $('#calendar').fullCalendar('unselect');
      },
      eventSources: [{
              googleCalendarId: self.state.email_address
            }]
    });

this.state.appointments.forEach(function(appointment){
  events.push( self.initalizeOldEvents(appointment) )
});

$('#calendar').fullCalendar('addEventSource', events );
},

Answer 1

如果你将Flux与React一起使用，你会发现你会从组件中取出状态并将其放入存储中。这将极大地简化您的组件，因为它们总是向存储请求它们的状态并使用它来呈现。