问题现象
文章图片
原因
【el-date-picker日期和时间范围无法选择时间的问题】原因验证:在chrome调试台获取该input元素,执行input.focus()
,然后点击input框出现下拉列表
尝试
- 在项目中,用DOM操作获取该input元素,然后
input.focus()
无效 - 将dialog和popover添加到body上 无效
- 给该el-date-picker添加属性
:teleported="false"
popper-class="need-focus-input"
- 定义类
.need-focus-input{ position: fixed !important; left: 570px !important; //定位按自己项目位置需求来 top: 252px !important; //定位按自己项目位置需求来 margin: 0px !important; .el-popper__arrow{ top:407px !important; } }
注意:由于下拉框没有添加在body上,所以不能在style scoped中定义该类
推荐阅读
- VUE 自定义指令实现点击后禁用elementUI按钮
- Vue3自制UI框架的技术总结
- 常见的 Monorepo 框架大比较
- Vue动态绑定背景图片及三元运算操作
- 我想写一个 Vue3 组件库,我该怎么开始()
- 7个 Vue3 中的组件通信方式
- Vue3中实现路由跳转的过渡动画(一)
- Vue3中插槽的概念和用法
- 关于Vue3的defineProps用法