vue 使用 FullClendar

1. 安装FullClendar插件 根据自己的需求安装基本功能还是高级功能。

   // 仅使用基本功能的 安装此命令
   npm install fullcalendar
   // 如若需使用高级功能（含基本功能） 使用此命令安装
   npm install fullcalendar-scheduler

    两种功能说明参考官网介绍：https://fullcalendar.io/docs/initialize-globals

2. 基本功能
   

   vue代码

   <template>
     <div>
       <FullCalendar :options="calendarOptions" />
     </div>
   </template>
   
   <script>
   import FullCalendar from "@fullcalendar/vue";
   import dayGridPlugin from "@fullcalendar/daygrid";
   export default {
     name: "WorkOrderSearch",
     components: {
       FullCalendar
     },
     data() {
       return {
         calendarOptions: {
           plugins: [dayGridPlugin],
           initialView: "dayGridMonth"
         }
       };
     }
   };
   </script>
   

   效果如图：

   

    

    

4. 2
5. 3
6. 4