完整日历在添加到月视图时更改事件的开始/结束时间

Question

在选择中添加新事件时，似乎 FullCalendar 正在更改我的事件的开始和结束时间。这仅发生在月视图中，而不是在议程周视图中。

mounted () {
  let vm = this
  $(this.$refs.calendar).fullCalendar({
    defaultView: 'month',
    header: {
      left: 'title',
      center: '',
      right: 'today agendaWeek,month prev,next'
    },
    allDaySlot: false,
    allDayDefault: false,
    firstDay: 1,
    select: function (start, end, jsEvent, view, resourceObj) {
      vm.addEvent(start, end, view)
    }
  })
},
methods: {
  addEvent: function (start, end) {
    // Here this.hour and this.minute are variables which in my example would be 6 and 0
    from = moment(start).set({'hour': this.hour, 'minute': this.minute})
    to = moment(end).set({'hour': this.hour, 'minute': this.minute})
    this.renderEvent(from, to)
  },
  renderEvent: function (start, end) {
    // Make temporary id
    let tmpId = `tmp-${this.getLocalEvtId()}`
    console.log(start.format('YYYY-MM-DD HH:mm'))
    // Add new event
    $(this.$refs.calendar).fullCalendar('renderEvent', {
      id: tmpId,
      title: 'NA',
      start: start,
      end: end,
      color: '#bd362f',
      editable: false
    }, false)
    // Find newly created event
    let event = $(this.$refs.calendar).fullCalendar('clientEvents', tmpId)[0]
    console.log(event.start.format('YYYY-MM-DD HH:mm'))
  }
}

当我使用此代码添加事件时.log第一个控制台会记录 2018-04-10 06：00(或我设置为开始的任何时间(，但第二个 2018-04-10 00：00。从议程周视图添加事件时，两个日志 2018-04-10 06：00。有人遇到过类似的问题吗？

编辑：JSFiddle jsfiddle.net/sbxpv25p/494

Answer 1

我在这份文档的帮助下解决了这个问题：https://fullcalendar.io/docs/moment

fullCalendar 扩展了 momentJS，使时刻可能具有不明确的时间。当您在无时间视图类型(例如 month(上选择一个区域时，它会创建一个不明确的计时时刻，并且在这种类型的时刻上调用 momentJS 的"set"方法来设置时间没有任何效果，或者至少 fullCalendar 没有考虑它(我猜它会在决定如何呈现它之前检查该时刻是否"hasTime"。通过拖动"月"视图创建的时刻将此标志设置为 false ，即使您尝试设置时间的组成部分(。

你需要做的是使用 fullCalendar 的扩展"time"方法来设置时间，并使 fullCalendar 再次认为时刻对象是非歧义的(关于时间(：

function addEvent(start, end, view) {
  start.time('06:00:00');
  end.time('06:30:00');
  if (view.name === 'agendaWeek') to.add(1, 'days')
  renderEvent(start, end);
}

有关工作示例，请参见 http://jsfiddle.net/sbxpv25p/495/。