element-plus的table组件 的type=“expand” 模式,如何修改小图标?
问题描述
element-plus 的 table 组件 的 type=“expand” 模式,如何修改colunm的展开小图标
问题出现的环境背景及自己尝试过哪些方法
在 element-ui 也就是 vue2 支持的组件库中可以通过修改i标签 content 属性,修改 i 标签,然后修改图标
但是 element-plus 支持的是 svg 形式的图标,对于这种没有向外暴露修改接口的组件,如何去修改图标?
相关代码
粘贴代码文本(请勿用截图)element-ui 修改图标的方式
// .el-table__expand-icon .el-icon-arrow-right:before{
// content: "\e6d9";
// border: 1px solid #ccc;
// padding: 0.0px;
// }
你期待的结果是什么?实际看到的错误信息又是什么?
如何修改element-plus中没有向外暴露接口的组件的图标?
回复
1个回答

test
2024-07-16
我记得之前回答过一次类似的问题 element-plus的v-loading中element-loading-spinner使用el-icon里面的图标不生效? - SegmentFault 思否
也就是说,现在的 Ele+
已经不是原来的那种使用字体图标库的方式,而是以直接传入 svg
的形式来实现图标组件了。所以如果想要去自定义的话,就不能只通过修改CSS伪类的 content
属性来实现了。
大概看了一下 table
组件的源码, 并没有提供一个修改 expand
图标的 slot
或者属性暴露出来。所以如果说一定要实现的话,倒是可以自己写 CSS 伪类的方式来实现。
回复

适合作为回答的
- 经过验证的有效解决办法
- 自己的经验指引,对解决问题有帮助
- 遵循 Markdown 语法排版,代码语义正确
不该作为回答的
- 询问内容细节或回复楼层
- 与题目无关的内容
- “赞”“顶”“同问”“看手册”“解决了没”等毫无意义的内容