Vue:下拉框多选影响行高

目录

  • [一、 出现场景](#一、 出现场景)
  • [二、 解决方案](#二、 解决方案)

一、 出现场景

在使用el-select增加multiple属性进行多选时,会出现高度塌陷的情况

二、 解决方案

首先需要在el-select中增加collapse-tags属性,并在style中增加如下样式

方案一

html 复制代码
<style scoped>
::v-deep .el-select .el-tag {
  width: 60px;
}

::v-deep .el-select .el-tag:last-child {
  width: auto !important;
}
</style>

方案2

html 复制代码
<style scoped>
::v-deep .el-select__tags-text {
  max-width: 60px !important;
}
</style>
相关推荐
user205855615181314 小时前
Windows 项目安装时报 `node-sass` 错误,如何快速处理
前端
LiaCode14 小时前
Redis 在生产项目的使用
前端·后端
LiaCode14 小时前
一天学完 redis 的爽翻版核心知识总结
前端·后端
大刚测试开发实战14 小时前
如何内网穿透访问本地私有化部署的TestHub
前端·后端·github
风骏时光牛马14 小时前
# Ruby基于Rails框架实现多角色权限管理与数据分页查询完整实战代码案例
前端
weedsfly14 小时前
迭代器、生成器与异步迭代——让数据“按需流动”的艺术
前端·javascript
xiaodaoluanzha14 小时前
迄今為止,最簡單的編程語言 Nolang
前端·后端
Csvn14 小时前
Fetch 请求竞态终结者:AbortController 不只是用来"取消"的
前端
阡陌Jony14 小时前
关于前端路由中的参数问题的学习(一): params,query, hash(#)
前端
阡陌Jony14 小时前
缓存相关学习笔记(一):Service Worker 缓存
前端