如何解决Fullcalendar和Vuex
在全日历更新了他们的道具以使其超出<FullCalendar />
元素之外之后,我在渲染事件时遇到了一些问题。
我知道状态请求已在Vuex中完成,因为我已经在无吸气剂和无吸气剂的情况下测试了如此多的东西,而且似乎没有任何作用...
<template>
<v-container>
<FullCalendar :options="calendarOptions" />
<li v-for="event in events" :key="event.id">
{{event.name + ' ' + event.start}}
</li>
</v-container>
</template>
<script>
import FullCalendar from '@fullcalendar/vue'
import dayGridPlugin from '@fullcalendar/daygrid'
import interactionPlugin from '@fullcalendar/interaction'
import timeGridPlugin from '@fullcalendar/timegrid'
import listPlugin from '@fullcalendar/list'
import { mapState,mapActions,mapGetters } from 'vuex'
export default {
components: {
FullCalendar
},data() {
return {
calendarOptions: {
plugins: [timeGridPlugin,listPlugin,dayGridPlugin,interactionPlugin ],initialView: 'dayGridMonth',selectable: true,events: this.allEvents,}
}
},computed: {
...mapState({
events: state => state.calendar.events
}),...mapGetters('calendar',['allEvents']),},created () {
this.getAll();
},methods: {
...mapActions('calendar',{
getAll: 'getAll',}),}
}
</script>
有什么方法可以只用状态来渲染元素?我以为将事件设置为this.events是可以的,但是我可能离这里很远。我是Vue和Vuex的新手,所以非常感谢您的帮助! :)列表只是为了知道状态正在按预期方式工作。
解决方法
您仍然可以通过执行以下操作将事件绑定到模板中:
<FullCalendar :options="{
...calendarOptions,events: events
}" />
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。