Calendar 日历 查看和编辑,背景,上月下月今天点击事件

63 阅读1分钟

第一次接触Calendar日历,只能去官网elementui上看基本使用

微信图片_20231002101504.png 问题一:解决点击日历查看和编辑 1.使用基本日历框,将查看和编辑对话框准备好;以及日历框内的内容

4.png 2.首先需要对接接口将数据获取,对应的参数先在data中;

1.png 3.对接接口将数据获取到页面或者添加数据

    addPlan(row) {
      if (row.id) {
        this.title = '查看详情';
        this.calendarVisible = true;
        getEntityById(row.id).then((res) => {
          if (res.code === 200) {
            this.params = {
              id: res.result.id,
            };
          }
           this.getMouth(this.value);
        });
      }
    },

4.背景图的插入用css样式写的;

      activyList: [
        { id: 1, dat: '星期一', title: '观' },
        { id: 2, dat: '星期二', title: '书' },
        { id: 3, dat: '星期三', title: '寻' },
        { id: 4, dat: '星期四', title: '迹' },
      ],

5.png 5.点击上月、下月、今天获取实时数据;

      value: new Date(),

6.png