在Vue项目中用fullcalendar制作人员日历
作者:互联网
1、基本使用
npm install --save @fullcalendar/vue @fullcalendar/core @fullcalendar/daygrid
- 引用、注册FullCalendar组件,得到一个月视图的日历。
<script>
import FullCalendar from '@fullcalendar/vue'
import dayGridPlugin from '@fullcalendar/daygrid'
export default {
components: {
FullCalendar
},
data() {
return {
calendarPlugins: [ dayGridPlugin ]
}
}
}
</script>
<template>
<FullCalendar defaultView="dayGridMonth" :plugins="calendarPlugins" />
</template>
<style lang='less'>
//用什么插件必须引入相应的样式表,否则不能正常显示
@import '~@fullcalendar/core/main.css';
@import '~@fullcalendar/daygrid/main.css';
</style>
功能定制
https://fullcalendar.io/docs/plugin-index- 设置为中文
<FullCalendar locale="zh-cn" />
参考链接:https://segmentfault.com/a/1190000019962644
https://www.cnblogs.com/bllx/p/9850577.html 很多配置项有注释
https://blog.csdn.net/ymnets/article/details/78661247 FullCalendar 日历插件中文说明文档
标签:Vue,fullcalendar,日历,daygrid,https,FullCalendar,import,制作人员 来源: https://www.cnblogs.com/wlhappy92/p/fullCanlender.html