el-select 多选添加collapse-tags之后换行问题

最新推荐文章于 2024-06-03 20:07:08 发布

前进的心

最新推荐文章于 2024-06-03 20:07:08 发布

阅读量2.7k

点赞数 4

文章标签： elementui

本文链接：https://blog.csdn.net/weixin_53558474/article/details/126577918

版权

使用el-select组件, 多选,添加collapse-tags之后,首个选中项文字太长导致换行,超出输入框

如下图

需要在style中修改

<style lang='scss'>
    .el-select__tags {
      display:flex;
      flex-wrap:nowrap;
    }
    .el-select__tags-text {
      max-width: 80px;  //设置最大宽度 超出显示...
      display: inline-block;
      overflow: hidden;
      vertical-align:bottom;
      text-overflow:ellipsis;
    }

</style>

如此就好了