记录一下,我们在使用element的下拉组件的时候,如果内容过长,会导致溢出非常的不美观,那么有没有什么解决 办法了
经过不断的寻找,终于找到了以下解决办法
1:增加如下属性
<el-select
v-model="form.projOrgId"
filterable
placeholder="请选择"
style="width: 80%"
clearable
:disabled="!isAdd"
@change="changeProject"
:popper-append-to-body="false"
>
<el-option
v-for="item in projectData"
:key="item.id"
:label="item.projectName"
:value="item.orgId"
/>
</el-select>
2:重写css样式
::v-deep .el-select-dropdown{
width:400px !important;
}
::v-deep .el-scrollbar{
width:400px !important;
}
切记要加:popper-append-to-body="false"这个属性,不然没法生效哦
最后来个效果图,大功告成