更改el-select-dropdown_item selected选中颜色

更改el-select-dropdown_item selected选中颜色

默认为element主题色

在修改element select下拉框选中颜色时会发现不生效,原因是:el-select下拉框插入到了body中

解决办法:

在select标签里填写:popper-append-to-body="false"属性,禁止select下拉框插入到body中

html 复制代码
<el-select 
  v-model="value" 
  @change="changeProjectStatus" 
  placeholder="请选择" 
  :popper-append-to-body="false">
   <el-option
      v-for="item in tabOptions"
      :key="item.status"
      :label="item.label"
      :value="item.status">
    </el-option>
</el-select>

然后更改选中元素的颜色,就可以了

css 复制代码
::v-deep .el-select-dropdown__list .selected{
    color: #2e49ad;
  }

但是,我在另一个组件中写了却不起作用(像是被下面的元素遮挡了),最后写在了全局样式里,才显现出来,不知道什么原因?

相关推荐
yume_sibai10 小时前
Element Plus 数据展示组件完全指南(15个核心组件)
前端·javascript·vue.js
weixin_4225554218 小时前
el-menu子菜单点击就被激活,恢复之前的激活状态
javascript·vue.js·elementui
honkun621 小时前
vue 表格组件 vxe-table 实现拖拽列字段自动生成透视表汇总
前端·javascript·vue.js
leoZ23121 小时前
第 4 篇:布局骨架——页面壳、栅格、卡片
前端·javascript·vue.js·opencv·计算机视觉·数据挖掘·语音识别
何以解忧,唯有..21 小时前
Vue 3 模板语法详解:从插值到指令的完整指南
前端·javascript·vue.js
yume_sibai1 天前
Element Plus 导航与反馈组件完全指南(15个核心组件)
前端·elementui·交互
雪芽蓝域zzs1 天前
第十四节:后端返回权限动态路由
前端·javascript·vue.js
Rain5091 天前
谁动了我的 URL?——记一次微前端“灵异 Bug“的排查实录
前端·vue.js·人工智能·前端框架·bug·ai编程
何以解忧,唯有..1 天前
Vue 3 响应式核心:ref() 与 reactive() 的深入解析与实战
前端·javascript·vue.js
宿6741 天前
vue3-async
前端·javascript·vue.js