ant-design-vue中通过css修改a-tree的折叠打开图标

最新推荐文章于 2025-10-23 18:08:35 发布

原创最新推荐文章于 2025-10-23 18:08:35 发布 · 3.8k 阅读

4 ·

CC 4.0 BY-SA版权

文章标签：

#ant-design-vue

ant-design-vue 专栏收录该内容

4 篇文章

订阅专栏

本文介绍了一种不使用switcherIcon属性即可自定义Ant Tree组件中开关图标的方法，通过直接修改CSS样式，实现了对图标关闭和打开状态的完全自定义。

又发现了一个新的科技，通过修改样式，不需要switcherIcon就可实现。
直接贴代码

//关闭样式
/deep/ .ant-tree-switcher-close{
	background: url('自定义关闭背景图') no-repeat;
	i{
		display: none;
	}
}
//打开样式
/deep/ .ant-tree-switcher-open{
	background: url('自定义打开背景图') no-repeat;
	i{
		display: none;
	}
}