Jquery fullcalendar.io上的事件增加一倍

Jquery fullcalendar.io上的事件增加一倍,jquery,ruby-on-rails,twitter-bootstrap,fullcalendar,reactjs,Jquery,Ruby On Rails,Twitter Bootstrap,Fullcalendar,Reactjs,我正在为我的项目使用rails和react.js。假设我创建了事件A,但随后我改变主意并取消了它(通过引导模式),然后我启动另一个事件B,并确认它,事件A仍然被创建。我错过什么了吗 componentDidMount: function(){ var self = this; var events = []; $('#calendar').fullCalendar({ googleCalendarApiKey: self.props.publicApi,

我正在为我的项目使用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 );
},

如果您将通量与React一起使用,您会发现您将从组件中取出状态并将其放入存储中。这将大大简化您的组件,因为它们总是只需向存储请求状态并使用该状态进行渲染。

如果将Flux与React一起使用,您会发现您将从组件中取出状态并将其放入存储中。这将大大简化您的组件,因为它们总是只需向存储请求它们的状态并使用该状态进行渲染