vue 实现日历看板

• vue + elementUI + moment

• 根据切换月份查看当月的日历

• main.ts

  import Vue from "vue";
  import App from "./App.vue";
  import router from "./router";
  import store from "./store";
  import moment from "moment";
  import ElementUI from "element-ui";
  import "element-ui/lib/theme-chalk/index.css";

  Vue.prototype.$moment = moment;
  Vue.prototype.$moment.locale("zh-cn");

  Vue.use(ElementUI);
  Vue.config.productionTip = false;

  new Vue({
  router,
  store,
  render: h => h(App),
  }).$mount("#app");

• vue.d.ts

  // 1. 确保在声明补充的类型之前导入 'vue'
  import Vue, { ComponentOptions } from "vue";
  import echarts from "echarts"; // 引入echarts
  // 2. 定制一个文件，设置你想要补充的类型
  // 在 types/vue.d.ts 里 Vue 有构造函数类型
  declare module "vue/types/vue" {
  // 3. 声明为 Vue 补充的东西
  interface Vue {
  $moment: any;
  }
  }

• 效果图

• calendar.vue

• commonDate.vue

• 效果图