element-puls 使用 el-date-picker 弹出框位置错位

本文指出在使用 Element-UI 日期时间选择器时可能出现弹出位置错位的问题，尤其在多个选择器频繁切换的情况下。原因是 Vue 的虚拟 DOM 更新机制导致 DOM 节点复用错误。解决方案是为每个日期时间选择器组件添加唯一的key属性，文中给出了示例代码，并强调了一些注意事项，如确保key值唯一、动态绑定以及避免不必要的更新，以有效避免弹出窗口位置错位问题。

摘要 针对Element Plus日期选择器弹出框超出宽度出现滚动条的问题，解决方案是使用popper-options属性调整弹出位置。通过设置placement为'left'，并配置offset修饰器（如[10, 150]）来控制偏移量。该方法参考了Element Plus官方文档的API说明，可灵活调整不同位置的偏移量值。

2、在el-select里面添加:append-to-body="false"属性,如果不添加的话,我们查看元素会发现下拉框所在的div和el-select是不同级的,是在最外面,添加以后就可以在el-select的子级元素中看到了。2、在el-date-picker标签添加一个class， popper-class="time-date-picker"解决：1、同上类似 给el-date-picker标签添加属性:append-to-body="false"二、el-date-picker相关。

Element UI中日期选择日（date-picker）等其他选择器下拉显示错位、位置错误解决

el-date-picker日期选择器选择框位置异常

问题：使用两个时间选择器，切换错乱的问题 1. 2. 解决方法有两个 1.把v-if改成v-show 2.指定el-date-picker的key 用来区分 ​​​​​​

el-date-picker日期选择器选择框位置异常

一般情况我们的下拉选项框偏移造成这种情况的就是我们同一个html页面中出现不同形式的下拉时间选择。当我们出现这种情况的时候只需要在我们这个html的日期时间选择器上加上不同的key值就可以了。

elementUI

有时候popper-append-to-body设置成false不生效，此时需要找到el-select对应的父节点设置样式：overflow:inherit!项目开发过程中发现el-select和el-date-picker弹出框显示时候，滚动屏幕，导致弹出框定位出现问题。2、el-date-picker提供了append-to-body属性的配置。1、select提供了popper-append-to-body属性的配置。首先考虑到看一下element-ui官网提供的api，如下图。

el-date-picker样式修改

切换日期类型时，立马点日期会出现错位，检查发现是日期的展开面板并没有插入到body中导致的错位。给el-date-picker加上唯一key值就可以。

写表单的时候经常会用到el-date-picker组件，但是时间选择框会偏移位置，这时候只需要在日期选择中添加key就可以了 如下 <el-date-picker popper-class="elDatePicker" size="small" v-model="obj.date_start" type="datetime" placeholder="选择时间" ...

在使用时间控件时分秒滚轮发生错位在对应页面下使用/deep/穿透也是无法对元素进行矫正。