likes
comments
collection
share

el-date-picker日期和时间范围无法选择时间的问题

作者站长头像
站长
· 阅读数 24

问题现象

el-date-picker日期和时间范围无法选择时间的问题

原因

dialog嵌套和popover嵌套导致input时间框无法获取焦点原因验证:在chrome调试台获取该input元素,执行input.focus(),然后点击input框出现下拉列表

尝试

  • 在项目中,用DOM操作获取该input元素,然后input.focus() 无效
  • 将dialog和popover添加到body上 无效

解决方法

  • 给该el-date-picker添加属性 :teleported="false" popper-class="need-focus-input"
  • 定义类

    <style lang="scss">
    .need-focus-input{
      position: fixed !important;
      left: 570px !important;  //定位按自己项目位置需求来
      top: 252px !important;   //定位按自己项目位置需求来
      margin: 0px !important;
      .el-popper__arrow{
      top:407px !important;
      }
    }
    </style>

    注意:由于下拉框没有添加在body上,所以不能在style scoped中定义该类