Element-PLUS下拉框、日期组件、下拉菜单定位问题 element-plus下拉框组件定位问题 element-plus日期组件定位问题

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"
       />
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值