<template>
<div ref="eventCalendarRef" class="event-calendar"></div>
</template>
<script lang="ts" setup>
import { onMounted, ref } from "vue";
// @ts-ignore
import { eventCalendar } from "./lib/event-calendar.dev.js";
import "./lib/event-calendar.css";
import { eventCalendarProps } from "./event-calendar";
defineOptions({ name: "EventCalendar" });
const {
events,
date,
config,
locale,
mode,
calendars,
colors,
editorConfig,
editorValidation,
} = defineProps(eventCalendarProps);
const eventCalendarRef = ref();
const eventCalendarInstance = ref();
const { EventCalendar } = eventCalendar;
onMounted(() => {
eventCalendarInstance.value = new EventCalendar(eventCalendarRef.value, {
config: config,
events: events,
calendars: calendars,
date: date,
mode: mode,
colors: colors,
editorConfig: editorConfig,
editorValidation: editorValidation,
locale: eventCalendar[locale],
});
});
defineExpose({
instance: eventCalendarInstance,
});
</script>
<style lang="scss" scoped>
</style>
更多【python-Dhtmlx Event Calendar 付费版使用】相关视频教程:www.yxfzedu.com