el-select多选设置collapse-tags属性将它们合并为一段文字展示时，超过显示长度以...省略号显示，且在一行展示

项目场景：

目前展示是这样分两行展示的：

想要的展示效果：

---

解决方案：

            <span class="multiple-el-select">
              <span class="search-title">计费方式</span>
              <el-select
                v-model="exampleManageParams.billingMethod"
                placeholder="请选择"
                filterable
                reserve-keyword
                clearable
                multiple
                collapse-tags
                :popper-append-to-body="false"
                :loading="isSelectGetDataLoading">
                <el-option
                  v-for="item in hasBillingMethod"
                  :key="item.paymentMethodCode"
                  :label="item.paymentMethodName"
                  :value="item.paymentMethodCode"
                  :disabled="item.disabled = exampleManageParams.billingMethod.length >=10 && !exampleManageParams.billingMethod.includes(item.paymentMethodCode)">
                  <span>{
    
    {
    
     item.paymentMethodName }}（{
    
    {
    
    item.paymentMethodCode}}）</span>
                </el-option>
              </el-select>
            </span>

样式书写，不在一行时，调节一下下面的参数适合自己的便可以变为一行：

.multiple-el-select /deep/ .el-select .el-select__tags .el-tag {
    
    
  max-width: calc(100% - 70px) !important;
}
.multiple-el-select /deep/ .el-select__tags-text:last-child {
    
    
  width: 25px !important;
  overflow: visible !important;
}

注意：下拉框有点小问题，选中的对号压住了选中的文字，自己再调节一下样式便可。