vue3中,element-plus中el-select隐藏下拉箭头

需求:el-select需要隐藏下拉箭头

html 复制代码
            <el-select v-model="apply.dataType" readonly>
              <el-option :key="1" label="样品检相同项目" :value="1" />
              <el-option :key="2" label="样品检不同项目" :value="2" />
            </el-select>

解决方法:

1、给组件添加自定义类名 class="no-arrow-select"

html 复制代码
            <el-select class="no-arrow-select" v-model="apply.dataType" readonly>
              <el-option :key="1" label="样品检相同项目" :value="1" />
              <el-option :key="2" label="样品检不同项目" :value="2" />
            </el-select>

2、设置样式

html 复制代码
<style scoped lang="scss">
:deep .no-arrow-select .el-select__caret {
  display: none;
}
</style>

运行效果:

相关推荐
无风听海19 小时前
Bearer Token 权威指南:从原理到生产级安全实践
前端·javascript·安全
jerrywus20 小时前
别只换模型!Claude Opus 4.8 努力控制 + Fast模式,真实能省钱3倍
前端·agent·claude
riuphan20 小时前
JavaScript 类型判断完全指南
前端·javascript
Hilaku20 小时前
前端工程师最终会变成 AI工程师?
前端·javascript·程序员
yeflx20 小时前
Ubuntu22.04重装显卡驱动
前端·chrome
flyinmind20 小时前
Java环境与Android环境中使用QuickJS
java·开发语言·javascript·quickjs
小二·20 小时前
Prompt Engineering 高级技巧:CoT/ToT/ReAct 等进阶方法论实战
前端·react.js·prompt
chancygcx_20 小时前
前端框架React day1--React入门
前端·react.js·前端框架
如烟花的信页20 小时前
数美滑块逆向分析
javascript·爬虫·python·js逆向
quan_泉20 小时前
DIDCTF 取证初学者
java·服务器·前端