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图标库在低版本谷歌浏览器中渲染异常，如何解决？的详细内容，更多请关注抖狐科技其它相关文章！