如何使用事件数据转换在 FullCalendar Vue 中传递自定义数据答案

【问题标题】：How to pass custom data in FullCalender Vue with eventDataTransform如何使用事件数据转换在 FullCalendar Vue 中传递自定义数据
【发布时间】：2021-06-21 18:14:25
【问题描述】：

我有每个事件的自定义数据点（例如 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)
    },
  },
};

【问题讨论】：

标签： vue.js fullcalendar

【解决方案1】：

在示例中找到。 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>

【讨论】：