网上搜了很多文章,几乎都是单独设置el-select__tags-text的max-width,如果页面有很多不同宽度的el-select就比较麻烦了,下面是通过refs对不同的el-select的max-width进行修改 <el-select v-model="form.operation_center" size="small" style="width: 200px;" clearable filterable multiple collapse-tags ref="t...
如果不希望使用 collapse-tags,可以通过自定义样式来控制 el-select 的高度和换行行为。 css /* 自定义样式 */ .custom-select .el-select__tags { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; /* 或根据需求设置合适的宽度 */ } .custom-select .el-tag { max...
// el-select的宽度必须大于el-select__tags的宽度,才不会覆盖清空按钮 this.domSelectTags.style.width = totalWidth + 'px'; this.domSelectTags.style.maxWidth = totalWidth + 'px'; this.domSelect.style.width = (totalWidth + 20) + 'px'; this.domSelect.style.maxWidth = (totalWidth + 20)...
1, item, item.groupCode ? groupCodeOptions[item.groupCode] : item.options)"><span>{{ selmultiAll(key, 2) ? $t('全不选') : $t('全选') }}</span></li><templatev-if="item.slotTitle"><liv-html="item.slotTitle"class="el-select-dropdown__item"style="user-select: none"></li...
使用el-select的多选下拉选择时,如果默认的选择会撑开input,显示所选的全部内容; 这样子很难看,样式还不整齐。 文档中有tag的形式展现,设置collapse-tags属性将它们合并为一段文字: 就不会出现上述的情况了。 但是当多选的内容多长的时候,后面还是会撑开换行,照样使样式不整齐: 看了上面的element元素发现: 这时候...