el-select多选以tag展示时，超过显示长度以...省略号显示

Question

tag标签过长时，会出现“溢出”的情况，想要当超过后自动截取并以省略号显示
目前

想要实现的结果

目前的写法没有实现
代码

<el-select
                        v-show="overviewVO.adType !== 'COMPANY'"
                        :multiple="overviewVO.adType === 'GROUP' ? true : false"
                        collapse-tags
                        v-model="ancountVO.advertisersId"
                        placeholder="请选择广告组"
                        size="small"
                        @change="selectAdvertisers"
                        clearable
                    >
                    <el-option
                        v-for="item in codeList.advertisersList"
                        :key="item.advertisersId"
                        :label="item.advertisersName"
                        :value="item.advertisersId"
                    />
                    </el-select>

css：

// select的tags过长显示...
.el-select__tags-text {
  display: inline-block;
  max-width: 140px;
  @media (max-width: 1400px) {
    max-width: 42px;
  }
  overflow: hidden;
  text-overflow:ellipsis;
  white-space: nowrap;
}
.el-select .el-tag__close.el-icon-close {
  top: -7px;
  right: -4px;
}

Answer 1

可以看下这个，如果不行应该需要配合/deep/使用：

.el-cascader__tags .el-tag:nth-child(1){
  max-width: 100px;
  overflow:hidden;
}