[踩坑]iconfont Symbol svg引入无法更改颜色

起因

最近公司组织架构调整（反正每次组织架构调整，领导就会下场。有一个idea或者有重构一下，先定一个月底上），被拉取一个项目组做新项目。这边图标现状：有些项目是font-face方式，有些用的阿里图标库，最近又在用腾讯图标库，有些甚至直接切图。

拥抱变化，迎接新技术吧。新项目这边使用svg方式引入图标。有一个地方的图标有两种状态：选中与非选中。按照以前我使用font-face的方式，设计只需要传一套，我这边改颜色，既然很多大佬（比如：张鑫旭）都说SVG Sprites比font-face高几层楼，那肯定也支持颜色更改吧。

这不我就刷到了张大佬的svg图标更改颜色，讲得通俗易懂，十分全面。

外部交涉

我试了所有方式，都没成功。好家伙，时间紧，任务重。也就不想纠结原因了，然后就想着找设计要两套吧。发生了以下对话：

设计：你怎么又改不了
我： 这边是用的svg那种呀，改不了
设计：自己下回多去试试
设计：别个都行，你不行
交涉ing....
我：巴拉巴拉(切图，也可以，图标库也可以，反正给我两套吧)
设计：懒得跟你说，我忙得很
我（内心）：这人怎么能一下戳中人的怒气点了，我不忙？
复制代码

别个都行，你不行，杀伤力确实大，我赶紧放下手上工作看看到底是不是自己不行了。上次font-face不能改颜色，好像是图底色问题。这次不会？

问题排查

找一个图标库

既然别个都行，你不行。我就怀疑是不是腾讯的图标库不得行，阿里的可以。所以在阿里图标库随便添加几个，下载项目。

image.png

image.png

对比两个图标的path

image.png

原因

所以还是svg生成的时候设置了fill属性，导致无法更改颜色。修改方法，需要设计那边上传单色图标。