首页 > 解决方案 > 事件不会出现在 vuejs 的完整日历中

问题描述

我在完整日历中显示事件时遇到问题。数据以正确的格式来自后端,当我在其中显示的属性title : "", start: "" and end: ""中手动添加一些模拟数据时,但是当我说-> 来自后端的对象列表时,它不会出现。这是我的代码:eventscalendarOptionsevents: "this.listOfEvents"

<template>
  <FullCalendar :options="calendarOptions" :events="calendarOptions.events" />
</template>

<script>
export default {
  components: {
    FullCalendar,
  },
  computed: mapGetters(["listOfEvents"]),
  data: () => ({
   // events: [],
    user: JSON.parse(localStorage.getItem("loggedUser")),
    startDateTime: moment()
      .clone()
      .format("D-M-YYYY h:mm:ss"),
    endDateTime: moment()
      .clone()
      .format("D-M-YYYY h:mm:ss"),
      calendarOptions: {
      events: "this.listOfEvents",  //this is where I am trying to bind it
    // events: [
    //   {
    //     title: "dsegr",
    //     start: "2020-11-14 10:00:00.0"  //if I manually do this with the data that comes from my 
                                                server it works
    //   }
    // ],
    },

  }),
  methods: {
    getEventByUserAndDate() {
      store.dispatch("getEventByUserAndDate", {
        userId: this.user.id,
        start: this.startDateTime,
        end: this.endDateTime,
      })
      this.events = this.listOfEvents;  
    },
  },
  created() {
    this.getEventByUserAndDate();
  },
};
</script>

标签: javascriptvue.jsfullcalendar

解决方案


推荐阅读