修改ElementUI 框架中 TreeSelect树形选择的Icon

前言:

记录项目中遇到的问题!

正文:

需求:修改树形选择展开/收起的图标,不适用默认三角,使用自定义

问题描述:在使用:deep()去修改样式的的时候发现不生效,在全局样式中修改可以生效,但 是这个需求只在单个页面中,不能影响其他页面的样式。

在控制台查看了元素的样式,发现元素和 #app 元素是同级别,是直接追加在body中的。el-poper-container-xxx 这个id的值也是个变量,刷新页面后数字会更变。

问了大模型,给了很多方法,尝试后无效,又去看ElementUI文档,通过prop属性可以给每一个el-tree-node添加类名

然后,在全局样式中进行样式修改,这样即完成了样式的修改,又不影响其他页面样式。

相关推荐
前端老石人几秒前
CSS 值定义语法
前端·css
sheeta199811 分钟前
Vue 前端基础笔记
前端·vue.js·笔记
小小小小宇11 分钟前
GitLab + GitLab Runner + Qiankun 微前端 + Nginx + Node 中间件 前端开发机从零搭建 CI/CD 全流程
前端
前端那点事16 分钟前
别再写垃圾组件!Vue3 如何设计「真正可复用」的高质量通用组件
前端·vue.js
卷帘依旧18 分钟前
JavaScript 中的 Symbol
前端·javascript
老王以为22 分钟前
Claude Code 从 GUI 到 TUI:开发者界面的范式回归
前端·人工智能·全栈
JYeontu24 分钟前
正方体翻滚Loading 2.0
前端·javascript·css
llq_35025 分钟前
React 组件处理 Props
前端
夫子39626 分钟前
多人协同后内容丢失?一文搞懂ONLYOFFICE document.key的正确用法
前端
张元清36 分钟前
React 与用户偏好:尊重用户已经在 OS 里设过的那些选项
前端·javascript·面试