Full Calendar의 동작 노트
13483 단어 FullCalendar
출처 확인
const $calendar = $('#calendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
defaultView: 'agendaWeek',
editable: true,
selectable: true,
selectHelper: true,
select: (start, end, jsEvent, view) => {
console.log('select');
console.log(start.toISOString());
console.log(end.toISOString());
$calendar.fullCalendar('renderEvent',
{
title: 'hoge',
start: start,
end: end
},
true
);
$calendar.fullCalendar('unselect');
},
eventClick: (event, jsEvent, view) => {
console.log('eventClick');
console.log(event.start.toISOString());
console.log(event.end.toISOString());
$calendar.fullCalendar('unselect');
},
eventResize: (event, delta, revertFunc, jsEvent, ui, view) => {
console.log('eventResize');
console.log(event.start.toISOString());
console.log(event.end.toISOString());
$calendar.fullCalendar('unselect');
},
eventDrop: (event, delta, revertFunc, jsEvent, ui, view) => {
console.log('eventDrop');
console.log(event.start.toISOString());
console.log(event.end.toISOString());
$calendar.fullCalendar('unselect');
},
events: (start, end, timezone, callback) => {
console.log('events');
console.log(start.toISOString());
console.log(end.toISOString());
},
//eventRender: (event, element) => {
// console.log('eventRender');
//}
});
조심해!!
[추기]
이후에야 비로소 상술한 확인용 소스를 알아차렸다
Full Calendar의 시간대가 설정되어 있지 않습니다.
설정이 없으면 선택하십시오
http://fullcalendar.io/docs/timezone/timezone/
false (no timezone, the default)
기본값no timezone
!!그러므로
timezone: 'UTC'
설정된 끝부분 추가timezone: no timezone의 경우
이벤트 (달력 표시 기간)
start.toISOString() => 2015-09-06
end.toISOString() => 2015-09-13
달력 표시일9/6 - 9/12
이므로 end피+1
2015-09-13
.따라서 서버에 보내는 조회는 이렇다.
선택 (새로운 이벤트 제작 묘사)
start.toISOString() => 2015-09-08T06:00:00
end.toISOString() => 2015-09-08T06:30:00
따라서 서버에 보내는 조회는 이렇다.이벤트Drop(이벤트 이동)
event.start.toISOString() => 2015-09-08T07:00:00
event.end.toISOString() => 2015-09-08T07:30:00
따라서 서버에 보내는 조회는 이렇다.이벤트 클릭
event.start.toISOString() => 2015-09-08T07:00:00
event.end.toISOString() => 2015-09-08T07:30:00
eventResize(크기별로 편집)
event.start.toISOString() => 2015-09-08T07:00:00
event.end.toISOString() => 2015-09-08T08:00:00
따라서 서버에 보내는 조회는 이렇다.참고로 브라우저의 시간대에 상관없이 상술한 것은 같다
var date = new Date();
date.toString();
date.getTimezoneOffset(); => 360
하여튼var date = new Date();
date.toString();
date.getTimezoneOffset(); => -540
console.log()
에 표시된 문자열은 같습니다.당연하다Full Calendar의 설정은
timezone: 'no timezone'
이기 때문이다.timezone: 'UTC'
이벤트 (달력 표시 기간)
start.toISOString() => 2015-09-06
end.toISOString() => 2015-09-13
선택 (새로운 이벤트 제작 묘사)
start.toISOString() => 2015-09-08T06:00:00.000Z
end.toISOString() => 2015-09-08T06:30:00.000Z
이벤트Drop(이벤트 이동)
event.start.toISOString() => 2015-09-08T07:00:00.000Z
event.end.toISOString() => 2015-09-08T07:30:00.000Z
이벤트 클릭
event.start.toISOString() => 2015-09-08T07:00:00.000Z
event.end.toISOString() => 2015-09-08T07:30:00.000Z
eventResize(크기별로 편집)
event.start.toISOString() => 2015-09-08T07:00:00.000Z
event.end.toISOString() => 2015-09-08T08:00:00.000Z
결실
UTC
를 잘 나타내는 문자열이 있습니다!
Reference
이 문제에 관하여(Full Calendar의 동작 노트), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/shingo-nakanishi/items/a2f375060ece06885170텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)