打开浏览器的开发者工具(通常可以通过按 F12 或右键点击页面元素选择“检查”来打开),然后检查 el-select 的下拉框(popper)是否已经被正确地分配了您指定的 popper-class。如果没有,请回到第1步检查是否有拼写错误或属性使用不当的情况。 4. 检查是否存在CSS样式的冲突或覆盖 有时候,即使您已经正确定义了样式,但...
</el-select> 在el-select选择器上加一定要加上这俩行: :popper-append-to-body="false" popper-class="select-popper" <style lang="scss" scoped> ::v-deep .select-popper { max-width: 360px !important; } ::v-deep .select-popper .el-select-dropdown__item { display: inline-block !import...
后面发现,el-select默认挂在在了body上,和当前页面不在一起,就导致了当设置<style lang="scss" scoped>样式无效。 解决方案 在el-select添加下面2个属性: popper-class = "selectStyle" :popper-append-to-body = "false" 并在css中设置 /deep/.el-select-dropdown__wrap.el-scrollbar__wrap{overflow: a...
1.在 el-select 添加 popper-class="popper-scrollbar-show" <el-selectv-model="form.propertyObject"clearable placeholder="请选择对象"popper-class="popper-scrollbar-show"><el-option v-for="item in socPropertyObjectOptions":key="item.dictValue":label="item.dictLabel":value="item.dictValue"/><...
2、修改.el-select-dropdown__item的样式 3、通过官网提供的popper-class进行样式修改 然而,上面的方法并没有说到点子上,覆盖全局样式的方法肯定不友好,修改样式和添加类也都不起作用。于是,我看了下下拉框的样式,它并没有在el-select里面,而是放在了最外层,如下图: ...
有网友说,popper-append-to-body要搭配popper-class一块使用,其实并不一定需要搭配使用,只要让对应元素加入到el-select结构中去,就可以直接修改对应样式了。poper-class的用法这样使用:<el-select v-model="value" popper-class="setSelect" :popper-append-to-body="false" placeholder="请选择"></el-select> ...
下拉框的option样式只能在全局样式里改,千万不能用scope,否则不生效 <el-select class="select" :popper-append-to-body="false" v-model="selectValue" placeholder="请选择" popper-class="select-option"> <el-option v-for="item in options"
110px" placeholder="请选择" :popper-append-to-body="false" popper-class="select-popper...
可能还有一个需要注意的地方,就是value-key的位置,一定要放在el-select上,而不是el-option上;放错位置是不会生效的。 这是自己的代码。 <el-form-itemlabel=""prop="createBy"><el-selectv-model="query.createBy"clearableplaceholder="活码创建人"multiplevalue-key="userId"ref="select"popper-class="depa...