近期项目中需要使用动态远程的svg库,记录一下实现方案:
具体的需求是可以动态加载服务端的svg文件,并能修改颜色
具体实现:
- 通过img直接加载远程文件,但是问题是无法动态修改svg文件样式
- 通过img src 直接加载svg文件内容,可以先将svg文件渲染出来然后修改颜色后获取内容再赋值给img src,但是这种可以再初始化的时候修改颜色成功,但无法动态的修改颜色
- 直接获取svg文件修改,动态修改svg元素的颜色等内容
问题:
因为采用得是直接引用的形式,所以如果是应用的样式id重复,当有多个相同id的样式引用的时候会只用最早加载的一个,因此当需要动态修改引用样式的时候要注意id的唯一性