Iconify图标库在低版本谷歌浏览器中渲染异常,如何解决?
iconify库与谷歌浏览器低版本的兼容性问题
项目中使用了iconify图标库,但在低版本的谷歌浏览器中遇到了图标渲染异常的问题。具体代码如下:
<ElIcon :class="prefixCls" :size="size" :color="color"> <span :class="$attrs.class" :style="getIconifyStyle"> <span class="iconify" data-icon="bx:edit"></span> </span> </ElIcon>
在114和124版本的谷歌浏览器中,使用bx:edit图标时,图标均能正常渲染。然而,使用material-symbols:add图标时,114版本的谷歌浏览器无法渲染该图标,而124版本则正常。
根据iconify官网的信息,material-symbols:add图标属于在线图标。在公司内网环境下,用户无法访问在线图标,导致异常渲染。因此,将material-symbols:add图标更换为离线图标即可解决问题。
至于项目中为何可以使用bx:edit图标,可能是因为该图标已被下载为离线图标,因此不受浏览器版本的限制。
以上就是Iconify图标库在低版本谷歌浏览器中渲染异常,如何解决?的详细内容,更多请关注硕下网其它相关文章!