vue 禁用element-ui calendar 取消非本月日期的点击事件

需求描述:原本的日历组件不是本月的日期是灰色的,且点击后会跳转到对应的月份,现在不想它跳转,需要禁用它的点击事件

方法:使用css的pointer-events:none属性即可,把不是当前月份的日历表格的td属性修改

::v-deep .el-calendar {

.el-calendar-table{

width: 100%;

height: 100%;

&:not(.is-range){

//使不是本月的日期不可点击,不会跳转到其他月份

// 当元素的 pointer-events 属性被设置为 none 时,该元素及其子元素将无法与鼠标或触摸设备产生交互作用,即无法触发事件。

td.next{

pointer-events: none;

}

td.prev{

pointer-events: none;

}

}

}

}

相关推荐
Y42583 小时前
本地多语言切换具体操作代码
前端·javascript·vue.js
不想上班只想要钱7 小时前
vue3+vite创建的项目,运行后没有 Network地址
前端·javascript·vue.js
岁月宁静8 小时前
在富文本编辑器中封装实用的 AI 写作助手功能
前端·vue.js·人工智能
533_8 小时前
[css] flex布局中的英文字母不换行问题
前端·css
533_11 小时前
[vue] dayjs 显示实时时间
前端·javascript·vue.js
武天12 小时前
Vue项目中有封装过axios吗?怎么封装的?
vue.js
jiangzhihao051513 小时前
升级到webpack5
前端·javascript·vue.js
橘子海全栈攻城狮13 小时前
【源码+文档+调试讲解】基于SpringBoot + Vue的知识产权管理系统 041
java·vue.js·人工智能·spring boot·后端·安全·spring
掘金安东尼14 小时前
官方:什么是 Vite+?
前端·javascript·vue.js
533_15 小时前
[css] border 渐变
前端·css