在创建的钩子中获取未定义的事件,Vue Kalendar 插件

在使用 Vue Kalendar 应用程序时遇到了一些问题,请按照信中的说明进行操作。


链接在这里:https : //kalendar.altinselimi.com/?ref=madewithvuejs.com


我的代码中有以下内容(必须将 kalendar-vue.css 更改为 KalendarVue.css 才能使其工作,所以不确定我是否遗漏了其他任何内容)。


我现在有几个错误,


创建的钩子错误:“TypeError:无法设置未定义的属性‘getEvents’”



创建的钩子错误:“TypeError:无法设置未定义的属性‘buildWeek’”


我正在使用的代码中没有生命周期钩子,所以我不确定组件本身是否有问题,我一直在环顾四周,但没有人提到这一点,所以看起来好像我的代码有问题。


<template>

    <kalendar :configuration="calendar_settings" :events="events"/>

</template>


<script>

import {

    Kalendar

} from 'kalendar-vue';

import 'kalendar-vue/dist/KalendarVue.css';


export default {

    components: {

        Kalendar,

    },

    data: () => ({

        events: [],

        calendar_settings: {

            style: 'material_design',

            view_type: 'week',

            cell_height: 20,

            scrollToNow: true,

            current_day: new Date(),

            read_only: false,

            day_starts_at: 0,

            day_ends_at: 24,

            overlap: true,

            hide_dates: ['2019-10-31'], // Spooky

            hide_days: [6],

            past_event_creation: true

        },

        new_appointment: {

            title: null,

            description: null

        }


    }),


    methods: {

        addEvent(popup_data, form_data) {

            let payload = {

                data: {

                    title: this.new_appointment.title,

                    description: this.new_appointment.description,

                },

                from: popup_info.start_time,

                to: popup_info.end_time,

            };


            this.$kalendar.addNewEvent(

                payload,

            );

            this.$kalendar.closePopups();

            this.clearFormData();

        },


        // Remove Event

        removeEvent(kalendarEvent) {

            let day = kalendarEvent.start_time.slice(0, 10);

            this.$kalendar.removeEvent({

                day,

                key: kalendarEvent.key,

                id: kalendarEvent.kalendar_id,

            })

        },

    }


}

</script>


<style scoped>


</style>

上面的代码是我正在使用的组件。


FFIVE
浏览 152回答 1
1回答
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript