Element-PLUS下拉框、日期组件定位问题 element-plus下拉框组件定位问题 element-plus日期组件定位问题
1、增加全局样式
.el-popper.is-pure {
inset: 36px auto auto 0px !important;
}
2、使用
Element-PLUS 下拉框、日期、下拉菜单等组件使用的都是 Popover,在组件中增加 :teleported="false"
属性,所有Popover相关的组件都可以参考下面示例解决
2.1、下拉框使用
<el-select :teleported="false" v-model="status" placeholder="请选择">
<el-option v-for="item in statusOptions" :key="item.value" :label="item.label" :value="item.value * 1" />
</el-select>
2.2、日期组件使用
在增加:teleported="false"
属性的基础上,设置 :popper-options
属性
<el-date-picker
:teleported="false"
:popper-options="{
modifiers: [
{
name: 'flip',
options: {
fallbackPlacements: ['bottom'],
allowedAutoPlacements: ['bottom'],
},
},
],
}"
v-model="estimatedTime"
placeholder="请选择"
style="width: 200px"
type="date"
value-format="YYYY-MM-DD"
/>