给element的Calendar的头部添加按钮—Vue.js

1、原型

2、代码

  // 默认渲染完成后
  mounted(){
    // 获取demo元素
    let nextBtn = document.querySelector(
      ".el-calendar__button-group .el-button-group > button:nth-child(3)"
    )
    // 获取button的父节点
    let parent = nextBtn.parentNode
    // 创建一个button元素
    let button = document.createElement("button")
    button.type = 'button' // 类型
    button.className = 'el-button el-button--plain el-button--mini' // Calendar默认按钮样式
    button.textContent = '+ 新建日程' // 文本
    button.style.cssText = "background-color: #ff6a00;color:white;margin-left:20px" // 样式
    button.onclick = function(){ // 触发事件 
      queryExistDataDays()
    }
    parent.appendChild(button) //添加
    function queryExistDataDays(){ // 事件内容
      console.log('---');
    }
  },

3、效果

参考：https://blog.csdn.net/qq_37213573/article/details/109355891