Блог

У меня есть пользовательские точки данных для каждого события (например, event.organizer). Я хочу, чтобы это было включено в календарь в разделе событий.

Я просмотрел документацию (https://fullcalendar.io/docs/eventDataTransform), но это довольно слабо, особенно в отношении компонента Vue (https://fullcalendar.io/docs/vue)

Может ли кто-нибудь помочь в том, как должен выглядеть компонент Vue? Мне нужно добавить реквизит? Следующее не сработало.

 import { resources, events }  from "/mockdata.js";
 

     <FullCalendar @eventDataTransform="eventDataTransform" :options="calendarOptions" />
 

 export default {
  components: {
    FullCalendar,
  },
  data() {
    return {
      calendarOptions: {
        plugins: [dayGridPlugin, interactionPlugin, resourceTimelinePlugin],
        initialView: "resourceTimeline",
        initialDate: "2021-06-18",
        resources,
        events,
      },
    };
  },
  methods: {
    eventDataTransform: function(json) {
      console.log(json)
    },
  },
};
 

Найдено в примере. https://github.com/fullcalendar/fullcalendar-example-projects/blob/master/vue3-typescript/src/Demo.vue#L115

 <FullCalendar :options="calendarOptions">
    <template v-slot:eventContent='arg'>
      <i>{{ arg.event.extendedProps.organizer }}</i>
    </template>
</FullCalendar>